{"dist":{"shasum":"2fad2c251d03593cf82e5275060ca6d6eddfef58","tarball":"https://registry.npmjs.org/solid-meta/-/solid-meta-0.24.6-beta.0.tgz","fileCount":6,"integrity":"sha512-Dmchuib9bzm1Qy6v0oVpLBT7+bev7Y02xjtGmdfJIxe5t3MBugGsZxf/YksWY+tda4Sw9N2rkpMNx+1E737bFw==","signatures":[{"sig":"MEUCIQDbytonFHbgx/1CclYYISvmlS/qg4tdr6u3l6XRLsdF2AIgcAv9Lg0JtdXVkL5barNuS5HyTLcxZieF04fItJd+uLw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":13566,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgKEcgCRA9TVsSAnZWagAAlbwQAIixQUQuhbn6/lpZP+e4\nRNYc7S3nq1Xy20K8ijzfjFxYYOEpvx3uIWiwf1E28kYrAB1F710DmhrSJsf0\njW2oF0YOoBH+YLyCEg9lU5fSxF/KzcaNbziQoJPN80uJLV1XQIsLjX1BY8VF\n5P6bzrqfPAAiI+FPagHntvc5z7BLkaqbdOn8MHQAmxsVVIs7hxAOOPCVDg7J\nP2vEmsvTMv/1eBzCrPsniS/C/1nJtOmQpXjiM1rjp8zPgNL1ewz8GAa8vE+4\nSKbV7rgypiRhnk3yHLOPO9Zd4tsjdrJs1F7D1HhfCkkUELReIomj4ykhPytS\nk77AaEN9+ZJO0BJ61NzOZk63lxB6l+kDw1Ak3XmS/7ioke1/uADQuzbjovFV\nYMiqzoiX+ptgU760yM7cNEwLl1vXrxmNMRWJiav+iWn/nxGhxFi9bcrNx366\nXhlSJkgQVHQzPt86o33R2PPjRT5F1+lSR5ebBzLDZNzswqHPDvUOnn1PhH5I\n6NxlQG85Ff6BJntgbuQH5j8CAK5zwEJYJPElGgBfp6m7H+CwNAD+/HVjdrYb\nE+1msv9Wx47JK/YtcE+xrBdQfz8n8+pzgSH44rWGzkDwTE1RC8igZ5KOvzBE\nqJoqJtX5Xc5EfyYKuBxqi42c1C7W1FhBBZ2zPZEoOITd/dlhCQiGtvwDXqml\n9NhA\r\n=H613\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","name":"solid-meta","type":"module","types":"dist/index.d.ts","author":{"name":"Ryan Carniato"},"readme":"# solid-meta [![npm Version](https://img.shields.io/npm/v/solid-meta.svg?style=flat-square)](https://www.npmjs.org/package/solid-meta)\n\nAsynchronous SSR-ready Document Head management for Solid based on [React Head](https://github.com/tizmagik/react-head)\n\n## Motivation\n\nThis module allows you to define `document.head` tags anywhere in your component hierarchy. The motivations are similar to [react-helmet](https://github.com/nfl/react-helmet) in that you may only have the information for certain tags contextually deep in your component hiearchy. There are no dependencies and it should work fine with asynchronous rendering.\n\n## Installation\n\n```sh\nnpm i solid-meta\n```\n\n## How it works\n\n1.  You wrap your App with `<MetaProvider />`\n1.  From the server, you pass `tags[]` array to `<MetaProvider />`\n1.  Then call `renderTags(tags)` and include in the `<head />` block of your server template\n1.  To insert head tags within your app, just render one of `<Title />`, `<Meta />`, `<Style />`, `<Link />`, and `<Base />` components as often as needed.\n\nOn the server, the tags are collected in the `tags[]` array, and then on the client the server-generated tags are removed in favor of the client-rendered tags so that SPAs still work as expected (e.g. in cases where subsequent page loads need to change the head tags).\n\n### Server setup\n\nWrap your app with `<MetaProvider />` on the server, using a `tags[]` array to pass down as part of your server-rendered payload. When rendered, the component mutates this array to contain the tags.\n\n```js\nimport { renderToString } from 'solid-js/web';\nimport { MetaProvider, renderTags } from 'solid-meta';\nimport App from './App';\n\n// ... within the context of a request ...\n\nconst tags = []; // mutated during render so you can include in server-rendered template later\nconst app = renderToString(\n  <MetaProvider tags={tags}>\n    <App />\n  </MetaProvider>\n);\n\nres.send(`\n  <!doctype html>\n    <head>\n      ${renderTags(tags)}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n    </body>\n  </html>\n`);\n```\n\n### Client setup\n\nThere is nothing special required on the client, just render one of head tag components whenever you want to inject a tag in the `<head />`.\n\n```js\nimport { MetaProvider, Title, Link, Meta } from 'solid-meta';\n\nconst App = () => (\n  <MetaProvider>\n    <div class=\"Home\">\n      <Title>Title of page</Title>\n      <Link rel=\"canonical\" href=\"http://solidjs.com/\" />\n      <Meta name=\"example\" content=\"whatever\" />\n      // ...\n    </div>\n  </MetaProvider>\n);\n```","exports":{".":{"solid":"./dist/index.jsx","default":"./dist/index.js"}},"gitHead":"083ac624f29d0fc0439d025abf1518d81a4dd5ce","license":"MIT","scripts":{"test":"jest && npm run test:types","build":"tsc && babel src/index.tsx --out-file dist/index.js","clean":"rimraf dist/","prebuild":"npm run clean","test:types":"tsc --project tsconfig.test.json"},"_npmUser":{"name":"ryansolid","email":"ryansolid@gmail.com"},"repository":{"url":"https://github.com/ryansolid/solid/blob/master/packages/solid-meta","type":"git"},"_npmVersion":"lerna/3.22.1/node@v14.15.1+x64 (linux)","description":"Solid wrapper for Styled JSX","directories":{},"maintainers":[{"name":"ryansolid","email":"ryansolid@gmail.com"}],"sideEffects":false,"_nodeVersion":"14.15.1","_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"solid-js":"^0.24.6-beta.0"},"peerDependencies":{"solid-js":"^0.24.0"},"_npmOperationalInternal":{"tmp":"tmp/solid-meta_0.24.6-beta.0_1613252384287_0.17390825552987366","host":"s3://npm-registry-packages"},"_id":"solid-meta@0.24.6-beta.0","version":"0.24.6-beta.0"}