@takeshape/routing 8.33.0 → 8.36.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@takeshape/routing",
-  "version": "8.33.0",
+  "version": "8.36.2",
   "main": "lib/index.js",
   "module": "es/index.js",
   "types": "lib/index.d.ts",
@@ -41,5 +41,6 @@
     "build:copy": "cp -rf build/src/* lib/",
     "will-it-blend": "pnpm typecheck && pnpm lint -- --quiet && pnpm test -- --silent --coverage false",
     "todo": "leasot 'src/**/*.{js,jsx,ts,tsx}'"
-  }
+  },
+  "readme": "# @takeshape/routing\n\n`@takeshape/routing` is a module designed to be used on the frontend of a site generated with\n[TakeShape](https://www.takeshape.io). It is library agnostic so it can be used with React, Vue, etc.\n\n### Installation\n\n```\nnpm install --save @takeshape/routing\n```\n\n### Routing\n\nThe `route` function is used to generate links on the client side. It allows you to create links to your static site\nwith content fetched from the [TakeShape GraphQL API](https://www.takeshape.io/docs/using-the-api-endpoint/). It's\nespecially useful when building out dynamic [search](https://www.takeshape.io/docs/search-queries/) or\n[taxonomy](https://www.takeshape.io/docs/search-queries/) pages.\n\n`route` is a curried function which consumes the following params\n\n- `config` - Object - The `tsg.yml` config object use `yaml-loader` to import it\n- `routeName` - String - The name of the desired route\n- `content` - Object - An object containing the properties referenced in the route string\n\ntsg.yml\n\n```yaml\ntemplatePath: src/templates\nstaticPath: static\nbuildPath: build\n\nroutes:\n  post:\n    path: /blog/:title/\n    template: pages/posts/individual.html\n```\n\nsearch-result-link.jsx\n\n```js\nimport {route as createRoute} from '@takeshape/routing';\nimport config from '../tsg.yml';\n\nconst route = createRoute(config);\n\nexport default function SearchResultLink({content}) {\n  return <a href={route(content._contentTypeName, content)}>{content.title}</a>;\n}\n```\n\nwhere the `content` prop would be:\n\n```json\n{\n  \"_contentTypeName\": \"post\",\n  \"title\": \"How TakeShape Routing Works\"\n}\n```\n\nRendered HTML:\n\n```html\n<a href=\"/blog/how-@takeshape/routing-works\">How TakeShape Routing Works</a>\n```\n\n### Image URLs\n\n`getImageUrl` converts asset paths into URLs suitable for use in an `<img>` tag.\n\n```js\nimport {getImageUrl} from '@takeshape/routing';\n\n<img src={getImageUrl('/my/image/path')}/>\n\n<img src={getImageUrl('/my/image/path', {w: 300, h: 250})}/> // image resized to 300x250\n\n```\n\nTakeShape uses [Imgix](https://www.imgix.com/) as its image CDN. Imgix provides rich suite of image manipulation\ncapatbilities that are accessible using the second argument of `getImageUrl`. See\n[their docs](https://docs.imgix.com/apis/url) for all the possibilites!\n\n### Asset URLs\n\nNot all assets in TakeShape are images and sometimes you just want a simple download link. Use `getAssetUrl` in this\ncase.\n\n```js\nimport {getAssetUrl} from '@takeshape/routing';\n\n<a href={getAssetUrl('/my/asset/path')} download>\n  Download Me\n</a>;\n```\n"
 }