{"_id":"@rstacruz/gatsby-remark-component","_rev":"7-3fad0888ae28bf7a4845d1470a1ca9b8","name":"@rstacruz/gatsby-remark-component","dist-tags":{"latest":"2.0.0","beta":"2.0.0-pre.2"},"versions":{"1.2.0-pre.1":{"name":"@rstacruz/gatsby-remark-component","description":"When you use a React component in your markdown, it will insert it as a div instead of a p","version":"1.2.0-pre.1","author":{"name":"Hebilicious","email":"xsh4k3@gmail.com"},"contributors":[{"name":"Rico Sta. Cruz","email":"rstacruz@users.noreply.github.com","url":"https://www.ricostacruz.com/"}],"main":"lib.js","repository":{"type":"git","url":"git+https://github.com/hebilicious/gatsby-remark-component.git"},"dependencies":{},"keywords":["gatsby","gatsby-plugin","gatsby-transformer-remark","component","remark","markdown"],"scripts":{"pretest":"npm run build","test":"jest","dev":"rollup -c --watch","build":"rollup -c","prepare":"rollup -c","prepublish":"npm run test"},"license":"MIT","devDependencies":{"@babel/core":"^7.4.3","@babel/preset-env":"^7.4.3","babel-jest":"^24.7.1","jest":"^24.7.1","prettier":"^1.16.4","remark":"^10.0.1","rollup":"^1.9.0","rollup-plugin-babel":"^4.3.2","rollup-plugin-node-resolve":"^4.2.0","unist-util-visit":"^1.4.0"},"licenseText":"The MIT License (MIT)\n\nCopyright (c) 20152018 Hebilicious\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n\n","_id":"@rstacruz/gatsby-remark-component@1.2.0-pre.1","dist":{"shasum":"94444908fa005a0dcb6df6c65761cd2055a9a6dc","integrity":"sha512-6PgE42bUxVk8NfibpGmuD437HeQZozbYF24F4MBiN4ROLwggJWtiSGatUf3FiH8LIrYcv0x7gEg8tyd9rQdVog==","tarball":"https://registry.npmjs.org/@rstacruz/gatsby-remark-component/-/gatsby-remark-component-1.2.0-pre.1.tgz","fileCount":12,"unpackedSize":18375,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcqGkFCRA9TVsSAnZWagAAsJoP/A7dVw4Lh4NXl46460T4\nhA9+xQMjC41qgB72/wPdNerReNrrMc7yjDSk9Y4xSP5sekURVgGMYaXkXUOS\numdFhqJ/y7RfP021rXgwRYx5pndUcyhntFutXFGyj70YBHa2nfXB2l7rz9rM\nk1Phgi3a4ZnaP56RRagfxcCVVhrcLWoZzHV1i4qCHNuLWZM9DqzydKrPadIf\nfonBKvMce4pigyxq/L8w6dwh4u1/vkdRBMqF/XgE3LJuveJy51ltX6Qgnz9D\ns6k0OSfSEFZ1Se07ExvAdBXnB/uYecQu/3RSBUK8r7BR8vaeVirIrwcKW7mK\nXNn2qo1i20uy9yjSh9jtI+o4Nc0UVXDyIUp2haMzVyvX9jrjOXvib10LyZ6J\neCwnVf1NpQAv7jk7lrXHdNP4I3j9A7EI/6tGR/lyETYuSSxoCgo/1vS7ggX8\n6fXrIEJulIDwlw306VXhLyLr7aarNlienErsy2c2nVOYTvzAzRd88y8GX2Kz\nNVwTnlrQjP4ryMxpli5Mr1CQLHPPADuMxoA1bjt0NFSKfacg/hTVgMYYWi2n\nEDUF7Tl/74Wcs3Fh/l8NH+tJ21pFUD6SZM0ngc9uEIvWyv4e26aGyh9qLr7y\n0DO00pgL5y5WtnY/iXCzhGcJF+eFmWOICwp5KsBVbVraSq3438QYYaLvf38d\nig1D\r\n=TQI3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFX5uAWT4uAwh/73QyWHabZYtEiXdZ7k/6ZB+MsZW9Z5AiBG1dtYDXHRqpaX3IJ7xdjk/UOHmfNVmOQXsN33OOe69Q=="}]},"maintainers":[{"name":"rstacruz","email":"dropbox@ricostacruz.com"}],"_npmUser":{"name":"rstacruz","email":"dropbox@ricostacruz.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/gatsby-remark-component_1.2.0-pre.1_1554540805033_0.39943936588549067"},"_hasShrinkwrap":false},"1.2.2-0":{"name":"@rstacruz/gatsby-remark-component","description":"When you use a React component in your markdown, it will insert it as a div instead of a p","version":"1.2.2-0","author":{"name":"Hebilicious","email":"xsh4k3@gmail.com"},"bugs":{"url":"https://github.com/rstacruz/gatsby-remark-component/issues"},"contributors":[{"name":"Rico Sta. Cruz","email":"rstacruz@users.noreply.github.com","url":"https://www.ricostacruz.com/"}],"dependencies":{},"devDependencies":{"babel-jest":"^25.1.0","jest":"^25.1.0","microbundle":"^0.12.0-next.8","prettier":"^1.19.1","remark":"^11.0.2","unist-util-visit":"^2.0.2"},"homepage":"https://github.com/rstacruz/gatsby-remark-component","keywords":["component","gatsby","gatsby-plugin","gatsby-transformer-remark","markdown","remark"],"license":"MIT","main":"dist/gatsby-remark-component.js","module":"dist/gatsby-remark-component.module.js","repository":{"type":"git","url":"git+https://github.com/rstacruz/gatsby-remark-component.git"},"scripts":{"build":"microbundle","dev":"microbundle --watch","prepare":"microbundle","prepublish":"npm run test","pretest":"microbundle","test":"jest"},"source":"src/index.js","readmeFilename":"README.md","readme":"> NB: This is an unofficial maintenance fork of [Hebilicious/gatsby-remark-component](https://github.com/Hebilicious/gatsby-remark-component), continued from it's v1.1.3. This fork is published under `@rstacruz/gatsby-remark-component`. You can use this as a drop-in subtitute for `gatsby-remark-component` using Yarn:\n>\n> ```sh\n> yarn add gatsby-remark-component@npm:@rstacruz/gatsby-remark-component\n> ```\n>\n> The rest of the original README is quoted below. For a list of improvements in this fork, see [CHANGELOG](./CHANGELOG.md).\n\n---\n\n# Gatsby Remark Component [![Build Status](https://travis-ci.org/Hebilicious/gatsby-remark-component.svg?branch=master)](https://travis-ci.org/Hebilicious/gatsby-remark-component) [![npm version](https://badge.fury.io/js/gatsby-remark-component.svg)](https://badge.fury.io/js/gatsby-remark-component)\n\nA gatsby-transformer-remark plugin that change the AST node parent of a custom component to a div.\n\n> - [Gatsby](https://www.gatsbyjs.org/)\n> - [gatsby-transformer-remark](https://www.gatsbyjs.org/packages/gatsby-transformer-remark/)\n\n## Install\n\n```bash\nyarn add gatsby-transformer-remark gatsby-remark-component\n```\n\n## Release Notes\n\n> v 1.1\n\n- New configuration options!\n- Can now auto-detect your custom components.\n\n## How to use\n\n> Read the great custom component article on the official gatsby remark blog [here](https://using-remark.gatsbyjs.org/custom-components/).\n\nThis is the base settings, your components inside your markdown will be auto-detected.\n\n```js\n//In your gatsby-config.js ...\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\"gatsby-remark-component\"]\n }\n }\n]\n```\n\nYou can explicitly declare the name of the components if you want to be strict. (it will disable the auto-detection\n)\n\n```js\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\n {\n resolve: \"gatsby-remark-component\",\n options: { components: [\"my-component\", \"other-component\"] }\n }\n ]\n }\n }\n]\n```\n\nWhen you start gatsby, your queries will be built from your components, and gatsby-remark-components will update the AST tree.\n\nThis will convert this graphql result:\n\n```json\n//...\n{\n \"type\": \"element\",\n \"tagName\": \"p\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nTo this:\n\n```json\n//...\n//Notice the tag name\n{\n \"type\": \"element\",\n \"tagName\": \"div\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nNow in your markdown template you can do:\n\n```jsx\nimport rehypeReact from \"rehype-react\"\nimport { MyComponent } from \"../pages/my-component\"\n\nconst renderAst = new rehypeReact({\n createElement: React.createElement,\n components: { \"my-component\": MyComponent }\n}).Compiler\n```\n\nReplace :\n\n```jsx\n
\n```\n\nby:\n\n```jsx\n
{renderAst(post.htmlAst)}
\n```\n\nAnd in your page query ... :\n\n```jsx\n//...\nmarkdownRemark(fields: { slug: { eq: $slug } }) {\n htmlAst // previously `html`\n\n //other fields...\n}\n//...\n```\n\nNow in your markdown you can do:\n\n```md\n# Some Title\n\nSome text\n\n\n```\n\nThis will render your component without any validateDOMNesting warning.\n","licenseText":"The MIT License (MIT)\n\nCopyright (c) 20152018 Hebilicious\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n\n","_id":"@rstacruz/gatsby-remark-component@1.2.2-0","dist":{"shasum":"8348e1560ed4407b7bd0b5bfa1becb5a14397fad","integrity":"sha512-otRucyUXd6/IDRpmC8FWu8Ta8SCgTjaGsN4ctH1R+CvC5G7UnJBDbLakgpWQZ/3oAMJwFPMqscGLbPSFwrIG7w==","tarball":"https://registry.npmjs.org/@rstacruz/gatsby-remark-component/-/gatsby-remark-component-1.2.2-0.tgz","fileCount":23,"unpackedSize":43582,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeYNdoCRA9TVsSAnZWagAALGYP/1614ngl3eWoQclXKZCP\n++tg6KzIqgsMGreTdMahamtx+Lw25WOo+ICtW7oAI/xXhglHpKSBsfcoKtQP\nfMAfftVjBT9yPRXZ0n13nhvAIbw22bVer11SsZIX8o5x3Jw8xJUOxgkFvvwI\nba2/Y8Th9LMz3tkMuMSretw1BvJM/Fmmi5JygAJw3ByuQLGh6CnvozIEzuG7\nunPnDF5cxpVc/PDSM3Jpykcc8eAT7TMJVaF1FGm62ed+P9fhq9hzt4AQuGED\nS4DE9w0279hl/JkygQ2YdeyYzHgIlPyHE6Ib407ixiryMdKeqXCyMZELUw84\nUcnD0Ni+4BcjROy7XUZhKrhXhsT0WLP97zU3Ib5X5aF4DHci1D5xDsCJPP20\nR7let0jJxiViZhnszEn1elc3dfNazQ8F/qA0dikLrKRxWe59Sn9vEPKArFo6\nKlwnIVpbsbjMAiQ6ZnYc/VTmk9s7G7FiFVqDrRcfqUsttAR3DwIvQS2B1QM9\nTUlASWubA59FIwGUw3PBSeub1o8pEDMlEDbksJ2jDG89TMYnukD6I5PVB+0X\nf+R/ik14W1ih2fVhlIly7IY1odZzq/uezSwCBuUCkpoSjKDO4K40GohQDzUe\n+XzVHY4qNejkmortGo8nMLpuagFCwoIdfzhPKkwEByRY2B8GmyX3QpbvEZWP\nOrbE\r\n=HUJL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGe+IiZwI5B8ISqCZ/VIfBcuYJ1X4pv4vRipA3ORAZAyAiB8CmeBh4TW67FJ8OfvXWzr0uW8WmUPzIk6qKdFbvNUWg=="}]},"maintainers":[{"name":"rstacruz","email":"dropbox@ricostacruz.com"}],"_npmUser":{"name":"rstacruz","email":"dropbox@ricostacruz.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/gatsby-remark-component_1.2.2-0_1583404904552_0.4946893829432577"},"_hasShrinkwrap":false},"1.2.2-1":{"name":"@rstacruz/gatsby-remark-component","description":"When you use a React component in your markdown, it will insert it as a div instead of a p","version":"1.2.2-1","author":{"name":"Hebilicious","email":"xsh4k3@gmail.com"},"bugs":{"url":"https://github.com/rstacruz/gatsby-remark-component/issues"},"contributors":[{"name":"Rico Sta. Cruz","email":"rstacruz@users.noreply.github.com","url":"https://www.ricostacruz.com/"}],"dependencies":{},"devDependencies":{"babel-jest":"^25.1.0","jest":"^25.1.0","microbundle":"^0.12.0-next.8","prettier":"^1.19.1","remark":"^11.0.2","unist-util-visit":"^2.0.2"},"homepage":"https://github.com/rstacruz/gatsby-remark-component","keywords":["component","gatsby","gatsby-plugin","gatsby-transformer-remark","markdown","remark"],"license":"MIT","main":"dist/gatsby-remark-component.js","module":"dist/gatsby-remark-component.module.js","publishConfig":{"access":"public"},"repository":{"type":"git","url":"git+https://github.com/rstacruz/gatsby-remark-component.git"},"scripts":{"build":"microbundle","dev":"microbundle --watch","prepare":"microbundle","prepublish":"npm run test","pretest":"microbundle","test":"jest"},"source":"src/index.js","readmeFilename":"README.md","readme":"> NB: This is an unofficial maintenance fork of [Hebilicious/gatsby-remark-component](https://github.com/Hebilicious/gatsby-remark-component), continued from it's v1.1.3. This fork is published under `@rstacruz/gatsby-remark-component`. You can use this as a drop-in subtitute for `gatsby-remark-component` using Yarn:\n>\n> ```sh\n> yarn add gatsby-remark-component@npm:@rstacruz/gatsby-remark-component\n> ```\n>\n> The rest of the original README is quoted below. For a list of improvements in this fork, see [CHANGELOG](./CHANGELOG.md).\n\n---\n\n# Gatsby Remark Component [![Build Status](https://travis-ci.org/Hebilicious/gatsby-remark-component.svg?branch=master)](https://travis-ci.org/Hebilicious/gatsby-remark-component) [![npm version](https://badge.fury.io/js/gatsby-remark-component.svg)](https://badge.fury.io/js/gatsby-remark-component)\n\nA gatsby-transformer-remark plugin that change the AST node parent of a custom component to a div.\n\n> - [Gatsby](https://www.gatsbyjs.org/)\n> - [gatsby-transformer-remark](https://www.gatsbyjs.org/packages/gatsby-transformer-remark/)\n\n## Install\n\n```bash\nyarn add gatsby-transformer-remark gatsby-remark-component\n```\n\n## Release Notes\n\n> v 1.1\n\n- New configuration options!\n- Can now auto-detect your custom components.\n\n## How to use\n\n> Read the great custom component article on the official gatsby remark blog [here](https://using-remark.gatsbyjs.org/custom-components/).\n\nThis is the base settings, your components inside your markdown will be auto-detected.\n\n```js\n//In your gatsby-config.js ...\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\"gatsby-remark-component\"]\n }\n }\n]\n```\n\nYou can explicitly declare the name of the components if you want to be strict. (it will disable the auto-detection\n)\n\n```js\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\n {\n resolve: \"gatsby-remark-component\",\n options: { components: [\"my-component\", \"other-component\"] }\n }\n ]\n }\n }\n]\n```\n\nWhen you start gatsby, your queries will be built from your components, and gatsby-remark-components will update the AST tree.\n\nThis will convert this graphql result:\n\n```json\n//...\n{\n \"type\": \"element\",\n \"tagName\": \"p\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nTo this:\n\n```json\n//...\n//Notice the tag name\n{\n \"type\": \"element\",\n \"tagName\": \"div\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nNow in your markdown template you can do:\n\n```jsx\nimport rehypeReact from \"rehype-react\"\nimport { MyComponent } from \"../pages/my-component\"\n\nconst renderAst = new rehypeReact({\n createElement: React.createElement,\n components: { \"my-component\": MyComponent }\n}).Compiler\n```\n\nReplace :\n\n```jsx\n
\n```\n\nby:\n\n```jsx\n
{renderAst(post.htmlAst)}
\n```\n\nAnd in your page query ... :\n\n```jsx\n//...\nmarkdownRemark(fields: { slug: { eq: $slug } }) {\n htmlAst // previously `html`\n\n //other fields...\n}\n//...\n```\n\nNow in your markdown you can do:\n\n```md\n# Some Title\n\nSome text\n\n\n```\n\nThis will render your component without any validateDOMNesting warning.\n","licenseText":"The MIT License (MIT)\n\nCopyright (c) 20152018 Hebilicious\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n\n","_id":"@rstacruz/gatsby-remark-component@1.2.2-1","dist":{"shasum":"931b57761c6f538989dc5738d2c8f560234ca33a","integrity":"sha512-+NpPfc4+UQpcc0ZPaWqmGXwCYJ9ChRiZkUYLT0tfKpBGR/ABChekUy1/VzF8Fgqsi6jjsc10+A9KI7SXLx+7jg==","tarball":"https://registry.npmjs.org/@rstacruz/gatsby-remark-component/-/gatsby-remark-component-1.2.2-1.tgz","fileCount":23,"unpackedSize":43631,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeYNh4CRA9TVsSAnZWagAAl6wQAJfff5jXyy867qlOJY+g\nLhG5ZPBxVkh9zGDbnHLYghYU77VjiN+DJ0A2K8P666m95YyBkeYiFkLSgna+\nlZm4Y16q2EON9hI4x8WuqRcHio6AFU8KA8+GGWsMJ65CIEnL6p2DgGUkcjrn\nUGTwOMt2MN5LhmOYhlUacwkMd14JCkFx3Adn0u/WsMr/Yc9y6BHe1WbMsTZE\n5EE82zO9olwH+xM97yFtBBwgZTDPvvKd93M6Ygs81a4pfi+29QxefFj5PIej\nQkRvRplOGxkrzGtIhs4bU1OFYR6iJNmtgdEISxGHioQbzyqI4Cfw8uhwRPTh\nRzn86UJFNlVni1IP/8lQDLOCSPxVlm8EyJwfUZMSZN2U7SiLKopfJVoCwT79\nEkMJ3tyNOVgrDRxme/SWR2OXYxgibunSE+sk6IjtiYrliLizyOqiCeRwzbRg\nfbaB7iPAtowISJfw0rDecZL42whg69V1+iI9H7MHS6fOT7s6uAXAw8iDolIo\nUq12bflwnY430Xqek7GtyADEFqzTkvXamgDBNSSO6+FxSDzivYme0lMjkCC+\nqCfErsmr6C0z/YhEIMYkfIbjKuVTHia8m+oa7DMGjA5be0448R3YNa3QU/Op\nJPTHiL994YSjBi0WeZnA6Ujxr9pLkD0ABJaK+OEN+ndV5vz/7mmf6eOxZbw7\nzyhl\r\n=/RCw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC3PukHrnesV4B1Ma9wP9QlpSyp9r67DhLMsx798CIPSQIhAJOY5aTwCe41XWjcakEhJSowsgsf+xqwi4VnBh8ej4Wn"}]},"maintainers":[{"name":"rstacruz","email":"dropbox@ricostacruz.com"}],"_npmUser":{"name":"rstacruz","email":"dropbox@ricostacruz.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/gatsby-remark-component_1.2.2-1_1583405176197_0.5603986542366244"},"_hasShrinkwrap":false},"1.2.2-3":{"name":"@rstacruz/gatsby-remark-component","description":"When you use a React component in your markdown, it will insert it as a div instead of a p","version":"1.2.2-3","author":{"name":"Hebilicious","email":"xsh4k3@gmail.com"},"bugs":{"url":"https://github.com/rstacruz/gatsby-remark-component/issues"},"contributors":[{"name":"Rico Sta. Cruz","email":"rstacruz@users.noreply.github.com","url":"https://www.ricostacruz.com/"}],"dependencies":{},"devDependencies":{"babel-jest":"^25.1.0","jest":"^25.1.0","microbundle":"^0.12.0-next.8","prettier":"^1.19.1","remark":"^11.0.2","unist-util-visit":"^2.0.2"},"homepage":"https://github.com/rstacruz/gatsby-remark-component","keywords":["component","gatsby","gatsby-plugin","gatsby-transformer-remark","markdown","remark"],"license":"MIT","main":"dist/gatsby-remark-component.js","module":"dist/gatsby-remark-component.module.js","publishConfig":{"access":"public","exists":true},"repository":{"type":"git","url":"git+https://github.com/rstacruz/gatsby-remark-component.git"},"scripts":{"build":"microbundle","dev":"microbundle --watch","prepare":"microbundle","prepublish":"npm run test","pretest":"microbundle","test":"jest"},"source":"src/index.js","readmeFilename":"README.md","readme":"> NB: This is an unofficial maintenance fork of [Hebilicious/gatsby-remark-component](https://github.com/Hebilicious/gatsby-remark-component), continued from it's v1.1.3. This fork is published under `@rstacruz/gatsby-remark-component`. You can use this as a drop-in subtitute for `gatsby-remark-component` using Yarn:\n>\n> ```sh\n> yarn add gatsby-remark-component@npm:@rstacruz/gatsby-remark-component\n> ```\n>\n> The rest of the original README is quoted below. For a list of improvements in this fork, see [CHANGELOG](./CHANGELOG.md).\n\n---\n\n# Gatsby Remark Component [![Build Status](https://travis-ci.org/Hebilicious/gatsby-remark-component.svg?branch=master)](https://travis-ci.org/Hebilicious/gatsby-remark-component) [![npm version](https://badge.fury.io/js/gatsby-remark-component.svg)](https://badge.fury.io/js/gatsby-remark-component)\n\nA gatsby-transformer-remark plugin that change the AST node parent of a custom component to a div.\n\n> - [Gatsby](https://www.gatsbyjs.org/)\n> - [gatsby-transformer-remark](https://www.gatsbyjs.org/packages/gatsby-transformer-remark/)\n\n## Install\n\n```bash\nyarn add gatsby-transformer-remark gatsby-remark-component\n```\n\n## Release Notes\n\n> v 1.1\n\n- New configuration options!\n- Can now auto-detect your custom components.\n\n## How to use\n\n> Read the great custom component article on the official gatsby remark blog [here](https://using-remark.gatsbyjs.org/custom-components/).\n\nThis is the base settings, your components inside your markdown will be auto-detected.\n\n```js\n//In your gatsby-config.js ...\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\"gatsby-remark-component\"]\n }\n }\n]\n```\n\nYou can explicitly declare the name of the components if you want to be strict. (it will disable the auto-detection\n)\n\n```js\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\n {\n resolve: \"gatsby-remark-component\",\n options: { components: [\"my-component\", \"other-component\"] }\n }\n ]\n }\n }\n]\n```\n\nWhen you start gatsby, your queries will be built from your components, and gatsby-remark-components will update the AST tree.\n\nThis will convert this graphql result:\n\n```json\n//...\n{\n \"type\": \"element\",\n \"tagName\": \"p\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nTo this:\n\n```json\n//...\n//Notice the tag name\n{\n \"type\": \"element\",\n \"tagName\": \"div\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nNow in your markdown template you can do:\n\n```jsx\nimport rehypeReact from \"rehype-react\"\nimport { MyComponent } from \"../pages/my-component\"\n\nconst renderAst = new rehypeReact({\n createElement: React.createElement,\n components: { \"my-component\": MyComponent }\n}).Compiler\n```\n\nReplace :\n\n```jsx\n
\n```\n\nby:\n\n```jsx\n
{renderAst(post.htmlAst)}
\n```\n\nAnd in your page query ... :\n\n```jsx\n//...\nmarkdownRemark(fields: { slug: { eq: $slug } }) {\n htmlAst // previously `html`\n\n //other fields...\n}\n//...\n```\n\nNow in your markdown you can do:\n\n```md\n# Some Title\n\nSome text\n\n\n```\n\nThis will render your component without any validateDOMNesting warning.\n","licenseText":"The MIT License (MIT)\n\nCopyright (c) 20152018 Hebilicious\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n\n","_id":"@rstacruz/gatsby-remark-component@1.2.2-3","dist":{"shasum":"26466d65a081a0cce350547b4e1c2a469b141f78","integrity":"sha512-BrUmlJ/wNV8JQCCnF08COvmy9o6foJRdHtVMn5vJ3BPzka/0ESTAxXlX1yHCPQxwBo3eY2Dth+VnDsZfxfWr4A==","tarball":"https://registry.npmjs.org/@rstacruz/gatsby-remark-component/-/gatsby-remark-component-1.2.2-3.tgz","fileCount":23,"unpackedSize":43651,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeYNm/CRA9TVsSAnZWagAAm4IP/0vjdyILzCxW+dVx5YRk\nxxEu6XhBoie2rf779/Qfqu3rB/0BnihzdFxw8lZmJSzwuSOAjR39qiIJM+DV\nezHqBCt+TETg+v3IJ8yv48BCMV/FOXSG7RRL63vBxzoHU7rVjav3AbTQL1do\n8pGFxsbOV/zNgY6MGbmPovt2S02c4uv2W15FkgVLjjtzKs1PE2xU36J9jVzm\npryDklsYP6rR3+sR/UO4gJH42a1I/O7qxkzfkg/Htrdcr8PMrPc5mEM78Asu\nkxkiKFt24jKsGwLE17q4wZPAnKEwtgVRLjKy12J0R8eRJuQglMukmOPghhWb\nlp5bVO0NL35r4oEU1VOyy78YiBL5EvnYuRYrTy6rbuyUy3wBvHd05AIRj5ZN\n2nIW6eS3+ps+aoMZiA0O+HXAaM4AMMvr1GzivecoHvinfO6kLESSGRfKx7at\nJ/2Qco3ySd4N8pSPzB5VQQ+Drxh1VI7midH3OUMQlAGMWPZRopfoEiulhFn5\nOhNX7f295DHB4Xxp5QmSBDQkFFLIrLcFXDBupzYMG9qEG6T/X7cU2cDTlRm4\nw0MCrpOqmBnaufNd+Z9Gj92qW4QCHO5Cok/o03cJEDl9yevhRWwla32Ao2fG\nHpR2IkNHlPgi5BJLEhioka1sTZChsuF62SeSasS3leaNEDaKl/sJwN9FfHSn\nWODl\r\n=GcAg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAvFNd6jEyxV+y4D65uTnN+VFRHVremD6Lm68E0J2mGVAiEA5PKfuROO297pk2KaFIjK+48jaVAKWEcugQmRdkdBWls="}]},"maintainers":[{"name":"rstacruz","email":"dropbox@ricostacruz.com"}],"_npmUser":{"name":"rstacruz","email":"dropbox@ricostacruz.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/gatsby-remark-component_1.2.2-3_1583405503195_0.10722500579783545"},"_hasShrinkwrap":false},"2.0.0-pre.1":{"name":"@rstacruz/gatsby-remark-component","description":"When you use a React component in your markdown, it will insert it as a div instead of a p","version":"2.0.0-pre.1","author":{"name":"Hebilicious","email":"xsh4k3@gmail.com"},"bugs":{"url":"https://github.com/rstacruz/gatsby-remark-component/issues"},"contributors":[{"name":"Rico Sta. Cruz","email":"rstacruz@users.noreply.github.com","url":"https://www.ricostacruz.com/"}],"dependencies":{},"devDependencies":{"babel-jest":"^25.1.0","jest":"^25.1.0","microbundle":"^0.12.0-next.8","prettier":"^1.19.1","remark":"^11.0.2","unist-util-visit":"^2.0.2"},"homepage":"https://github.com/rstacruz/gatsby-remark-component","keywords":["component","gatsby","gatsby-plugin","gatsby-transformer-remark","markdown","remark"],"license":"MIT","main":"dist/gatsby-remark-component.js","module":"dist/gatsby-remark-component.module.js","publishConfig":{"access":"public","exists":true},"repository":{"type":"git","url":"git+https://github.com/rstacruz/gatsby-remark-component.git"},"scripts":{"build":"microbundle","dev":"microbundle --watch","prepare":"microbundle","prepublish":"npm run test","pretest":"microbundle","test":"jest"},"source":"src/index.js","readmeFilename":"README.md","readme":"

\n

\n

\n\n

\ngatsby-remark-component\n

\n\n

\nEmbed components in React inside div wrappers.\n

\n\n

\n\n

\n\n
\n\nA gatsby-transformer-remark plugin that change the AST node parent of a custom component to a div. This is an unofficial maintenance fork of [Hebilicious/gatsby-remark-component](https://github.com/Hebilicious/gatsby-remark-component) continued from its v1.1.3.\n\n## Install\n\n```bash\nyarn add gatsby-transformer-remark @rstacruz/gatsby-remark-component\n```\n\n## Usage\n\n> Read the great custom component article on the official gatsby remark blog [here](https://using-remark.gatsbyjs.org/custom-components/).\n\nThis is the base settings, your components inside your markdown will be auto-detected.\n\n```js\n//In your gatsby-config.js ...\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\"@rstacruz/gatsby-remark-component\"]\n }\n }\n]\n```\n\nYou can explicitly declare the name of the components if you want to be strict.\n\n```js\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\n {\n resolve: \"gatsby-remark-component\",\n options: { components: [\"my-component\", \"other-component\"] }\n }\n ]\n }\n }\n]\n```\n\n## How it works\n\nWhen you start Gatsby, your queries will be built from your components, and gatsby-remark-components will update the AST tree.\n\n
\nTechnical details...\n\nThis will convert this graphql result:\n\n```json\n//...\n{\n \"type\": \"element\",\n \"tagName\": \"p\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nTo this:\n\n```json\n//...\n//Notice the tag name\n{\n \"type\": \"element\",\n \"tagName\": \"div\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nNow in your markdown template you can do:\n\n```jsx\nimport rehypeReact from \"rehype-react\"\nimport { MyComponent } from \"../pages/my-component\"\n\nconst renderAst = new rehypeReact({\n createElement: React.createElement,\n components: { \"my-component\": MyComponent }\n}).Compiler\n```\n\nReplace :\n\n```jsx\n
\n```\n\nby:\n\n```jsx\n
{renderAst(post.htmlAst)}
\n```\n\nAnd in your page query ... :\n\n```jsx\n//...\nmarkdownRemark(fields: { slug: { eq: $slug } }) {\n htmlAst // previously `html`\n\n //other fields...\n}\n//...\n```\n\nNow in your markdown you can do:\n\n```md\n# Some Title\n\nSome text\n\n\n```\n\nThis will render your component without any validateDOMNesting warning.\n\n
\n","licenseText":"The MIT License (MIT)\n\nCopyright (c) 20152018 Hebilicious\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n\n","_id":"@rstacruz/gatsby-remark-component@2.0.0-pre.1","dist":{"shasum":"b195714fc7ab192fb2db5618073806436820e76d","integrity":"sha512-X4Qmv/uwBU2f0wfc6HS+bZT/hIWDd72EhXMx8U23awOIRAnvDhCrbA85ZtVIE3NhBM8Ked9rX0oQfCuDCb+8kw==","tarball":"https://registry.npmjs.org/@rstacruz/gatsby-remark-component/-/gatsby-remark-component-2.0.0-pre.1.tgz","fileCount":23,"unpackedSize":43267,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeYNzsCRA9TVsSAnZWagAAzLkP/0eLrsg3BtKajniYIftE\nxmM8A20B5p5UYuvzNu6c4T3k2QfvOnxyRHPomh2V0gSVz+f6AqO0MUoAlvKC\niE3KKeYPu9y+bsRljhOuS85N4KmdS7kHZWyf0jEu/RZA7JVtgAWIUyOlQhrs\noSVnuD8o73YT+XdQhRHG2JvrxNJ8IpLbNg7phR+pYKhJDjkbVA/F9F97eTuI\nTBpuSfWml1dbkOwmVZMVrEswWUndwOMW92UAIq9BDLQI4N4nXHGZYYg/8gn8\nNScyoA2ZjSKg7h/FV1fKHsDE/4MYYCyqDmaXALTbrOY+3zNBgN34u38qs2fr\nI4KdI85Mc3YCWPM1/z8p0+z0XvtiRwfm96CLLzMZy9bHfxT2AhrF5i0hAHWz\njjIfqDK8stTE811oJ5PU8n6idisW+yQz1jiDdWoVxIQHfr3gjaOZ3PzAMCn5\nqmA7WsqdwiXDEDDvFOSEqYOGfgIk9dhtbzjvebOBdWD+/CrYO5AQDkCIVDdE\nOJCmmyQVz14BLnebgdVQuS2v+dtppoWzSkddtAH9OrtoARcHIhtXA2Q8qZ3D\njOTti4wnBoYVxrQ7VMGc+bfdpcRkT6hQYL1HQflMUMbtZ6OSo8VG8cH9VB5h\nv4tK5lN/2TZ/5cy6ad9CuZalIno1TrleKv6frIbX8RT4EKXimEeb9hyNvJvF\nr6A6\r\n=s+ya\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCCIB4kOsS9MojUECktQZrxRa1u1PueossqMxglDU2IHAIhAJYVD3O3HjeS78i96lz+1fFSU1QKooLzoB6b0Nt8VxQ2"}]},"maintainers":[{"name":"rstacruz","email":"dropbox@ricostacruz.com"}],"_npmUser":{"name":"rstacruz","email":"dropbox@ricostacruz.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/gatsby-remark-component_2.0.0-pre.1_1583406316006_0.5296835281129861"},"_hasShrinkwrap":false},"2.0.0-pre.2":{"name":"@rstacruz/gatsby-remark-component","description":"When you use a React component in your markdown, it will insert it as a div instead of a p","version":"2.0.0-pre.2","author":{"name":"Hebilicious","email":"xsh4k3@gmail.com"},"bugs":{"url":"https://github.com/rstacruz/gatsby-remark-component/issues"},"contributors":[{"name":"Rico Sta. Cruz","email":"rstacruz@users.noreply.github.com","url":"https://www.ricostacruz.com/"}],"dependencies":{},"devDependencies":{"babel-jest":"^25.1.0","jest":"^25.1.0","microbundle":"^0.12.0-next.8","prettier":"^1.19.1","remark":"^11.0.2","unist-util-visit":"^2.0.2"},"homepage":"https://github.com/rstacruz/gatsby-remark-component","keywords":["component","gatsby","gatsby-plugin","gatsby-transformer-remark","markdown","remark"],"license":"MIT","main":"dist/gatsby-remark-component.js","module":"dist/gatsby-remark-component.module.js","publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"repository":{"type":"git","url":"git+https://github.com/rstacruz/gatsby-remark-component.git"},"scripts":{"build":"microbundle","dev":"microbundle --watch","prepare":"microbundle","prepublish":"npm run test","pretest":"microbundle","test":"jest"},"source":"src/index.js","readmeFilename":"README.md","readme":"

\n

\n

\n\n

\ngatsby-remark-component\n

\n\n

\nEmbed components in React inside div wrappers.\n

\n\n

\n\n

\n\n
\n\nA gatsby-transformer-remark plugin that change the AST node parent of a custom component to a div. This is an unofficial maintenance fork of [Hebilicious/gatsby-remark-component](https://github.com/Hebilicious/gatsby-remark-component) continued from its v1.1.3.\n\n## Install\n\n```bash\nyarn add gatsby-transformer-remark @rstacruz/gatsby-remark-component\n```\n\n## Usage\n\n> Read the great custom component article on the official gatsby remark blog [here](https://using-remark.gatsbyjs.org/custom-components/).\n\nThis is the base settings, your components inside your markdown will be auto-detected.\n\n```js\n//In your gatsby-config.js ...\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\"@rstacruz/gatsby-remark-component\"]\n }\n }\n]\n```\n\nYou can explicitly declare the name of the components if you want to be strict.\n\n```js\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\n {\n resolve: \"gatsby-remark-component\",\n options: { components: [\"my-component\", \"other-component\"] }\n }\n ]\n }\n }\n]\n```\n\n## How it works\n\nWhen you start Gatsby, your queries will be built from your components, and gatsby-remark-components will update the AST tree.\n\n
\nTechnical details...\n\nThis will convert this graphql result:\n\n```json\n//...\n{\n \"type\": \"element\",\n \"tagName\": \"p\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nTo this:\n\n```json\n//...\n//Notice the tag name\n{\n \"type\": \"element\",\n \"tagName\": \"div\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nNow in your markdown template you can do:\n\n```jsx\nimport rehypeReact from \"rehype-react\"\nimport { MyComponent } from \"../pages/my-component\"\n\nconst renderAst = new rehypeReact({\n createElement: React.createElement,\n components: { \"my-component\": MyComponent }\n}).Compiler\n```\n\nReplace :\n\n```jsx\n
\n```\n\nby:\n\n```jsx\n
{renderAst(post.htmlAst)}
\n```\n\nAnd in your page query ... :\n\n```jsx\n//...\nmarkdownRemark(fields: { slug: { eq: $slug } }) {\n htmlAst // previously `html`\n\n //other fields...\n}\n//...\n```\n\nNow in your markdown you can do:\n\n```md\n# Some Title\n\nSome text\n\n\n```\n\nThis will render your component without any validateDOMNesting warning.\n\n
\n","licenseText":"The MIT License (MIT)\n\nCopyright (c) 20152018 Hebilicious\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n\n","_id":"@rstacruz/gatsby-remark-component@2.0.0-pre.2","dist":{"shasum":"a5f3bcc286acb40d08e66aa9e6a2e0951a6043e1","integrity":"sha512-QO8UyRB0z44mPrKs6UYHTWuD7J7W1yUASWNtQysOUmmDpMXXBLu+i0h5pYyhhLiZPSmPDQoKHp2qyAu1oFKS9Q==","tarball":"https://registry.npmjs.org/@rstacruz/gatsby-remark-component/-/gatsby-remark-component-2.0.0-pre.2.tgz","fileCount":23,"unpackedSize":43294,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeYN17CRA9TVsSAnZWagAA6vQP/13QfJn5h/i+Dq7Vz/sL\nQpDwETks51JhjJRsvrQRHnAZX9NmzrQktKgWFWy4exZl55ubOK7FdvDeMiYl\n/1PviJo/JngFf2zlSpdF64NHMBUvdcxLsP5HV8CpJEcvBIdsi3KFQpzZyeo8\nxebH3UxEt6txzzQPJcvpdwUq1siSbXaDj4y4C7QCXSZMcdr7cTXGNuAm8X5I\n1wJKN2FbhWRdc7f1vcYyNFqFPzx3XHHLaOiFceNHqjdXy3/Hr2fUzVksBDLL\nvEqaByY0FTZhoIRNLniH9leiUbi1j8n8J3o1Rz5cSOe0eb8FzTigd+EvuDn9\nIs4jdd1O1wHOSmexmM7ytLtLWDOHoUa+k1dyl+hLialiQntkQqqAju7ytPB3\nBlSnQhi21i+6C5l2wgjExIHTA1bYsT2VEmke6h6n/88ypIoJbjPT1ZuekogI\n+zaRUca7soE2Qbwb4yg6Wk7Or2T3sEfuh864myhqIRyAFmivmQr1be9wxFW6\njmZvKUmUGe4YRY6gfvr01kEOCSO4fMw4559qY54iggN5AAgioijDA11Dsjpo\n9IqNmizgRcEPpW2GD2ejYLZWtwyFASUi4jAHjVx8X+qeISXN6SWSxQPJzl8G\nyGuEBi5/djKgAwKYWFM1oBOpka2SwTxD+RSe4FT1iYmOZYwJKAw499PautGG\n8qA1\r\n=YHJt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEs4vbg/cKy+sBP5QV1WvKlleDpz4Tis0ZDXuCuBeN14AiEAvOzRzLl2aVenD/HG5WEJavxrVKbOcoquhrvmicRKyLI="}]},"maintainers":[{"name":"rstacruz","email":"dropbox@ricostacruz.com"}],"_npmUser":{"name":"rstacruz","email":"dropbox@ricostacruz.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/gatsby-remark-component_2.0.0-pre.2_1583406459020_0.34544399081206634"},"_hasShrinkwrap":false},"2.0.0":{"name":"@rstacruz/gatsby-remark-component","description":"When you use a React component in your markdown, it will insert it as a div instead of a p","version":"2.0.0","author":{"name":"Hebilicious","email":"xsh4k3@gmail.com"},"bugs":{"url":"https://github.com/rstacruz/gatsby-remark-component/issues"},"contributors":[{"name":"Rico Sta. Cruz","email":"rstacruz@users.noreply.github.com","url":"https://www.ricostacruz.com/"}],"dependencies":{},"devDependencies":{"babel-jest":"^25.1.0","jest":"^25.1.0","microbundle":"^0.12.0-next.8","prettier":"^1.19.1","remark":"^11.0.2","unist-util-visit":"^2.0.2"},"homepage":"https://github.com/rstacruz/gatsby-remark-component","keywords":["component","gatsby","gatsby-plugin","gatsby-transformer-remark","markdown","remark"],"license":"MIT","main":"dist/gatsby-remark-component.js","module":"dist/gatsby-remark-component.module.js","publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"repository":{"type":"git","url":"git+https://github.com/rstacruz/gatsby-remark-component.git"},"scripts":{"build":"microbundle","dev":"microbundle --watch","prepare":"microbundle","prepublish":"npm run test","pretest":"microbundle","test":"jest"},"source":"src/index.js","licenseText":"The MIT License (MIT)\n\nCopyright (c) 20152018 Hebilicious\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n\n","_id":"@rstacruz/gatsby-remark-component@2.0.0","dist":{"shasum":"ecc81499c43729379b7ea80b909ef120c9afa7dd","integrity":"sha512-R6HyaD/k5tC+ffpx4j6CyXWkp2fk59zAlEaeXIgvTZ2bARNcXcBwOZ2kA4kAHtVRQgtA982r/xIdAIIBAD+yDQ==","tarball":"https://registry.npmjs.org/@rstacruz/gatsby-remark-component/-/gatsby-remark-component-2.0.0.tgz","fileCount":23,"unpackedSize":43288,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeYN5ICRA9TVsSAnZWagAAI5MP/2vsm+CrmQcaFI4i7yQ0\nKmAZjTrf94C8b+5FhZmkga5DmyjBxjcInj0eqHDm9GX1/1D+TRTGtGnKpCJ3\nK3fKSY2wYsQ5YP5epFP5PBoxsVe14YIlRVRmRlSDvrIYogH3abjTYbq8d6gd\nTp+O1OFYL+eOo4pgFo4rfKwBaA4Sk7NTbWxDMcfW+8xXLzb1fNzDK07CiIaL\ni0O/SFA15i6rcwtv2MMMmqdOvhl76hQvbybdMQuZnhs8r5j8RzUrWY/F+17e\n4mnCuPB4sPByaF4GCs0ewOXGtp54sNc+qP3wHTXgGJoQrOgO+3KMK6S/wPEw\nfAhDXaBsSyKwmU80Pkg4Aw6R+H7KsPC4wcrpWic18go6yZbSy3H8azoRH/XZ\n7N3vPmo5GnKXbiDm+CYoIf3KlOW+9smzgkjjkA1JFdsVO1LUe5JUSvvrbTVG\nY5zrjs0bqYkVxwFDR0pCAopUN4PTYNhg4EXeqL23YnPgEOmRO3k3renR68kS\nznibFZqDyVpaaBC+83dSwk0YOLbcLRSlIW0mxu2CElfw4vDxV79DOIz7pMO8\nBFlwufGrjS4deg4SIVbASlWhYjn9j80fvBQY4aOTOsxu1IKzTdhgnnXITFPd\npXbh/sEgBAVsVRMnkR0ZIR2AsGaBZXqaNXSy3oR9gYlnFUqoXFWFnks2IHIr\nmIlz\r\n=Kurx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGL6SbgLgLK1xg93lNYcSyHXmoFuGNDtzUNfXjyXpSWCAiB2zTu/EfC6OLZFqsoGTE4BaSrXNPmH/vbxEoI0TMs5qQ=="}]},"maintainers":[{"name":"rstacruz","email":"dropbox@ricostacruz.com"}],"_npmUser":{"name":"rstacruz","email":"dropbox@ricostacruz.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/gatsby-remark-component_2.0.0_1583406664305_0.05792306099892852"},"_hasShrinkwrap":false}},"time":{"created":"2019-04-06T08:53:24.840Z","1.2.0-pre.1":"2019-04-06T08:53:25.162Z","modified":"2022-04-06T20:54:12.881Z","1.2.2-0":"2020-03-05T10:41:44.675Z","1.2.2-1":"2020-03-05T10:46:16.300Z","1.2.2-3":"2020-03-05T10:51:43.307Z","2.0.0-pre.1":"2020-03-05T11:05:16.172Z","2.0.0-pre.2":"2020-03-05T11:07:39.140Z","2.0.0":"2020-03-05T11:11:04.398Z"},"maintainers":[{"name":"rstacruz","email":"dropbox@ricostacruz.com"}],"description":"When you use a React component in your markdown, it will insert it as a div instead of a p","keywords":["component","gatsby","gatsby-plugin","gatsby-transformer-remark","markdown","remark"],"repository":{"type":"git","url":"git+https://github.com/rstacruz/gatsby-remark-component.git"},"contributors":[{"name":"Rico Sta. Cruz","email":"rstacruz@users.noreply.github.com","url":"https://www.ricostacruz.com/"}],"author":{"name":"Hebilicious","email":"xsh4k3@gmail.com"},"license":"MIT","readme":"

\n

\n

\n\n

\ngatsby-remark-component\n

\n\n

\nEmbed components in React inside div wrappers.\n

\n\n

\n\n

\n\n
\n\nA gatsby-transformer-remark plugin that change the AST node parent of a custom component to a div. This is an unofficial maintenance fork of [Hebilicious/gatsby-remark-component](https://github.com/Hebilicious/gatsby-remark-component) continued from its v1.1.3.\n\n## Install\n\n```bash\nyarn add gatsby-transformer-remark @rstacruz/gatsby-remark-component\n```\n\n## Usage\n\n> Read the great custom component article on the official gatsby remark blog [here](https://using-remark.gatsbyjs.org/custom-components/).\n\nThis is the base settings, your components inside your markdown will be auto-detected.\n\n```js\n//In your gatsby-config.js ...\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\"@rstacruz/gatsby-remark-component\"]\n }\n }\n]\n```\n\nYou can explicitly declare the name of the components if you want to be strict.\n\n```js\nplugins: [\n {\n resolve: \"gatsby-transformer-remark\",\n options: {\n plugins: [\n {\n resolve: \"gatsby-remark-component\",\n options: { components: [\"my-component\", \"other-component\"] }\n }\n ]\n }\n }\n]\n```\n\n## How it works\n\nWhen you start Gatsby, your queries will be built from your components, and gatsby-remark-components will update the AST tree.\n\n
\nTechnical details...\n\nThis will convert this graphql result:\n\n```json\n//...\n{\n \"type\": \"element\",\n \"tagName\": \"p\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nTo this:\n\n```json\n//...\n//Notice the tag name\n{\n \"type\": \"element\",\n \"tagName\": \"div\",\n \"properties\": {},\n \"children\": [\n {\n \"type\": \"element\",\n \"tagName\": \"my-component\",\n \"properties\": {},\n \"children\": []\n }\n ]\n}\n```\n\nNow in your markdown template you can do:\n\n```jsx\nimport rehypeReact from \"rehype-react\"\nimport { MyComponent } from \"../pages/my-component\"\n\nconst renderAst = new rehypeReact({\n createElement: React.createElement,\n components: { \"my-component\": MyComponent }\n}).Compiler\n```\n\nReplace :\n\n```jsx\n
\n```\n\nby:\n\n```jsx\n
{renderAst(post.htmlAst)}
\n```\n\nAnd in your page query ... :\n\n```jsx\n//...\nmarkdownRemark(fields: { slug: { eq: $slug } }) {\n htmlAst // previously `html`\n\n //other fields...\n}\n//...\n```\n\nNow in your markdown you can do:\n\n```md\n# Some Title\n\nSome text\n\n\n```\n\nThis will render your component without any validateDOMNesting warning.\n\n
\n","readmeFilename":"README.md","homepage":"https://github.com/rstacruz/gatsby-remark-component","bugs":{"url":"https://github.com/rstacruz/gatsby-remark-component/issues"}}