{"_id":"@artsy/next-layout","_rev":"20-381f1e610b2d9666daa4e457b6b514aa","name":"@artsy/next-layout","dist-tags":{"canary":"0.1.1-canary.3.24.0","latest":"0.2.0"},"versions":{"0.0.2-canary.1.10.0":{"name":"@artsy/next-layout","version":"0.0.2-canary.1.10.0","author":{"name":"Justin Bennett","email":"zephraph@gmail.com"},"license":"MIT","_id":"@artsy/next-layout@0.0.2-canary.1.10.0","maintainers":[{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"eessex","email":"eve@artsymail.com"}],"homepage":"","dist":{"shasum":"4550c14f4577ea1a224ca041e232664dfab168f0","tarball":"https://registry.npmjs.org/@artsy/next-layout/-/next-layout-0.0.2-canary.1.10.0.tgz","fileCount":4,"integrity":"sha512-YZrcoRt8byfCainas0ipbEE+KwUezk7OflHF1VQdSNCNR6ZRtYIYkEipitJiJDajQfm1acxqRzFk821McIVCqA==","signatures":[{"sig":"MEUCIQCPfK9nh2e1XnElpZTv9EV37AGdv/vX8SiZj30ahWP7xQIgZQHkqOuWvJ359GYnRomMFXzs1lhU8g8fd5nlDyJS9vE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":7999,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJerHHLCRA9TVsSAnZWagAAyL4P/0neCGY//V9bx2xjPZTF\nk/5tn2aK5K7aoIMbbv+uU/I7TwZZ8UGQKVf8ZY40dCt5+yi9tb0SpIrC+JdI\n7ID3sIFTDwV+oaTM2HwmQfLvggJLD5A9MDaw7Y9nAczrM0al+9683+HvQquO\ngA+dQWok1mAtnAmd8bgJkUItD+NbbeGOo1RaFIFY0fn7d3zaf4LpF4Xc5ljV\nS6ABCuqtZbC5xqP/1p3v3/0lN10h7HJKnBqnhY5MAw0kdakqksncyeJ+RdE+\njB2OwHoXuEcRa24B4RgDFkRAQoY6aYuudCCL5e0vX5mqJuLmuWHAKYaxw01q\n+QcVVU7GGr8oYerhUkmGsGoPDLV7a3iVgJUGa5xDwrTrm6zkrdRz1yk4DHvG\n2eTDKdC683XDUk4l5v78jyWHXU6rAWjcARCZhxnkUgpZLOR/49TgmsE0lVzG\np4kxS3YmdPueQq62ya/9jrFnptUYVEmk2W8SK7SybO7g/KAybfe05/qeDaP6\nycotSUu1c+x16Uaq0c2mg+STEycWrQcsg3mSXdSZ+035m+6M0oSFTjrDj96y\nHfhT1uoMISjz0WM1p2PjA1Ab3QwD1mQEFDfVQbOUT70N8iZht2Qio1I7DHlI\nAlektkC/QpDegMNrFcV6qjnuwJnA4QqglGSQYBnaUUosylhP+OcbSwlEUfZp\nPCxZ\r\n=r1dn\r\n-----END PGP SIGNATURE-----\r\n"},"main":"lib/index.js","gitHead":"c38e396e0393c44ea0e43ff50abb37602cb86903","scripts":{"test":"echo \"Error: run tests from root\" && exit 1"},"_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"_npmVersion":"lerna/3.20.2/node@v10.20.1+x64 (linux)","description":"Enhanced layout helpers for Next.js","directories":{"lib":"lib","test":"__tests__"},"_nodeVersion":"10.20.1","dependencies":{"find-up":"^4.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"next":"^9.3.6","react":"^16.13.1","@types/react":"^16.9.34"},"_npmOperationalInternal":{"tmp":"tmp/next-layout_0.0.2-canary.1.10.0_1588359626883_0.4258070509484655","host":"s3://npm-registry-packages"}},"0.0.2-canary.1.11.0":{"name":"@artsy/next-layout","version":"0.0.2-canary.1.11.0","author":{"name":"Justin Bennett","email":"zephraph@gmail.com"},"license":"MIT","_id":"@artsy/next-layout@0.0.2-canary.1.11.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"","dist":{"shasum":"e06e742f065cc4cd4d563a47053a4ea48644dc43","tarball":"https://registry.npmjs.org/@artsy/next-layout/-/next-layout-0.0.2-canary.1.11.0.tgz","fileCount":4,"integrity":"sha512-GvaMfRPz/ndr9U0xaqt9NBPmX1y0a51OtmePTdmz7JONrG7vRkgd4wQPD6IFxx7Tr2GG7DiL6Q4Z36onceM8ZA==","signatures":[{"sig":"MEYCIQDGDrHZQU8NVbZMp+TlPwqT9bfgqcjFQoArqeVXIgWXYwIhAPnOgF3YV4D0YjtSgEqBjgoWAG6o+tgwDV5gK7SJpi9b","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":7999,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJerHPCCRA9TVsSAnZWagAAMKwP/1kkFIFBTTOv7Fll8/Ad\nAXwy4j4zG7FNHDpFpO9tiXLls0wbsqon2A8k/sOENNywDNUiuD2bQ/ViHe+K\naCqwqfF4ZTketR+DkgNFhi0JbwCis9JyJaB+4YaRyU1iDn74/NDAGcI3QeB3\n6HGgOq0Hy35vt6XCX2yaFh2lHiF44RJkm5dE4CWWdjPLZW5CQXy0ft2/7JCW\nx2l0PaBEDP8jCoHHRBlbydwXAWh+yRJ9z358wxZrNvI1eQnFGiNQivdjpI/P\nb82mc0N2f6SzlIgmz0nLiUgwdpCVAFYNACTVPxq38CUF7AHDdcy/r2yFCr92\n54zqBrhZK+yFxjeIf7SB8w+Am3rySQwVhD5HBtf28/RlmNu7h+6adlbt/eFy\n2swHxs02a6dEIowqToiPCJXmqMeL9nRD0sIn2WkIpjlD1ZSY1s4FWLbRgWEP\nmLxk7GVK947U/kgEk8TxhgtjOnT0g1OxSGPLOlL86LUeBVGh0H6+3FIjNpOD\np4xBkdwqViaFEZ5lWpkV2pVGAxsMg+szKJD99bBlhGO9jfjMpjdCsS6THIvF\n4fKm/Ljqa5Bgtne2MGd4hR/NLuyFnW5QPCYlGwi2ETIO38rNE6CwfXbyx/ba\nWde0xqTuSo/2OJnaN4NL4bPZKeQ3SCEVZeo+d5wwUcJU9OIgZT4kIc3ZuyJI\nifgb\r\n=fYS3\r\n-----END PGP SIGNATURE-----\r\n"},"main":"lib/index.js","readme":"# @artsy/next-layout\n\nThis package provides a new mechanism for creating shared layouts in `Next.js`. Inspired by [this article](https://adamwathan.me/2019/10/17/persistent-layout-patterns-in-nextjs/), this package enables you to create a new `_layout` file anywhere in your `pages` directory to automatically provide a layout for all pages in that directory and its children.\n\n## Installation\n\n```\nyarn add @artsy/next-layout\n```\n\nIf you don't have one yet, create a `.babelrc` at the root of your Next.js project and add the following\n\n```js\nmodule.exports = {\n presets: [\"next/babel\"],\n plugins: [\"@artsy/next-layout/babel\"],\n};\n```\n\nIf you don't already have a `_app.tsx` or `_app.jsx` in your pages directory go ahead and create one. You'll need the following content:\n\n```js\nimport React from \"react\";\nimport { Layout } from \"@artsy/next-layout\";\n\nexport function App(props) {\n return ;\n}\n```\n\nIf you've already got an `_app` file and have made modifications to it, that's fine! Instead of returning `Component` from the props, make sure you pass props to `Layout` and return that instead.\n\n## Usage\n\n### Creating a layout\n\nInside the `pages` directory of your next.js app create a `_layout.tsx` or `_layout.jsx` in whatever directory you'd like to provide a layout for. If you put it in the root (`pages`) then all pages of your Next.js site would by default have that layout. If you place it in the `pages/blog` directory, then all pages in the `blog` directory will have that layout.\n\nA `_layout` file must have a _named_ export of `Layout`.\n\n```\nexport const Layout = ({ children }) => {\n return (\n <>\n

Welcome to my site!

\n {children}\n \n}\n```\n\nThe `children` prop passed to `Layout` is the Next.js page being rendered. `Layout` will also be passed any props that the Next.js page would receive.\n\n### Overriding a layout\n\nIf you have a particular page you'd like to override the layout on then doing so is pretty easy! In your page file, simply define a `Layout` property attached to your exported component.\n\n```\nconst MyPage = () => {\n return

Lorem Ipsum

\n}\n\nMyPage.Layout = ({ children }) => {\n return (\n <>\n

This is a layout override

\n {children}\n \n )\n}\n\nexport MyPage;\n```\n\nIf you'd just like to _disable_ the layout, you can do so by setting the `Layout` property to `null`.\n\n```\nconst MyPage = () => {\n return

Lorem Ipsum

\n}\n\n// This will disable the page's layout\nMyPage.Layout = null;\n\nexport MyPage;\n```\n","gitHead":"c38e396e0393c44ea0e43ff50abb37602cb86903","scripts":{"test":"echo \"Error: run tests from root\" && exit 1"},"_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"_npmVersion":"lerna/3.20.2/node@v10.20.1+x64 (linux)","description":"Enhanced layout helpers for Next.js","directories":{"lib":"lib","test":"__tests__"},"_nodeVersion":"10.20.1","dependencies":{"find-up":"^4.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"next":"^9.3.6","react":"^16.13.1","@types/react":"^16.9.34"},"_npmOperationalInternal":{"tmp":"tmp/next-layout_0.0.2-canary.1.11.0_1588360130358_0.43877058474050856","host":"s3://npm-registry-packages"}},"0.0.2-canary.2.14.0":{"name":"@artsy/next-layout","version":"0.0.2-canary.2.14.0","author":{"name":"Justin Bennett","email":"zephraph@gmail.com"},"license":"MIT","_id":"@artsy/next-layout@0.0.2-canary.2.14.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"","dist":{"shasum":"78c9dd3d4283aa18f474b910eeefc08063bf06f6","tarball":"https://registry.npmjs.org/@artsy/next-layout/-/next-layout-0.0.2-canary.2.14.0.tgz","fileCount":12,"integrity":"sha512-1BnuPu9JwyvOUpWCKHQtthjcEWkJE1TIPX+qRR9GlwFs2iNgT7IBPO3oZa7VT68l87fstGhL63exGYlhA5o2sw==","signatures":[{"sig":"MEYCIQCVINj89CQ/arr09uAz3esZkmLpgNS1ZSRdtGibS0YmdwIhALXrV86+bCXcGp4UuNqObRYpYSBpPhrDZSSns6sEmabF","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":15505,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJerKKYCRA9TVsSAnZWagAAVCcP/0h01hZYAD1SgqIhoKQ4\nt2z5v7SvS8dMlOMfQywSVUVUK3+wV7SPLmp12NltaF36GgfNbk26YJh5718M\nxts3MuMptX9KvIK+2ZaNneooB0IRH5Dad//v8qX4eTMy6rhWnWJ/8J944NC/\nrHveMxYpIBb6UwyIvB2kKlK8QXVFT4fHrXwZzl1VaJcFJgvfI/8s7JC7Ydy0\nptxJGhPM8Q26szEyhHBL+vVy+kb1yrZkfCuV3KvrpCnMaySdqUnD45G1dNpX\nt8AkKr9qK0sG+AVEgJSWKbmj9opoj9Wpp+yUvr30y5lPyO35pv1f05cvOhVZ\nr18B6lMaYyA9EXXcGCndYndOeAI4PhbNDwj5ZQ9cl9N1+4AyIj9gNLftMqdw\n/T9fc5Nh/Ff9Dg39yewP4NDWuWEGypkH1kIx3+45DV88UIqtbjMF//Ld+hgL\nF0xuWku7MqNDhoL3kgfp9LyDV9lche60mBs9Ut+atrqeKsa1oFq+cuLuOVlG\nF+ahCp/CzvPlvZoW6zuOh2M5M1OOx8ewsDjTy1N5YBM2Tqwq+yUiNFV+4dAQ\nWdGGxpGa6vmdEGpvnNdjUF28AFyeuH3EVyMwboXZTG/Y1DvJv953L9/vTBFz\nFurPEeFFk+CyvbQDuF8WZo+aJgvOru36nusAiTTnhJmvvszQZYRqPbt8kGFd\nkfg6\r\n=aBUi\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","readme":"# @artsy/next-layout\n\nThis package provides a new mechanism for creating shared layouts in `Next.js`. Inspired by [this article](https://adamwathan.me/2019/10/17/persistent-layout-patterns-in-nextjs/), this package enables you to create a new `_layout` file anywhere in your `pages` directory to automatically provide a layout for all pages in that directory and its children.\n\n## Installation\n\n```\nyarn add @artsy/next-layout\n```\n\nIf you don't have one yet, create a `.babelrc` at the root of your Next.js project and add the following\n\n```js\nmodule.exports = {\n presets: [\"next/babel\"],\n plugins: [\"@artsy/next-layout/babel\"],\n};\n```\n\nIf you don't already have a `_app.tsx` or `_app.jsx` in your pages directory go ahead and create one. You'll need the following content:\n\n```js\nimport React from \"react\";\nimport { Layout } from \"@artsy/next-layout\";\n\nexport function App(props) {\n return ;\n}\n```\n\nIf you've already got an `_app` file and have made modifications to it, that's fine! Instead of returning `Component` from the props, make sure you pass props to `Layout` and return that instead.\n\n## Usage\n\n### Creating a layout\n\nInside the `pages` directory of your next.js app create a `_layout.tsx` or `_layout.jsx` in whatever directory you'd like to provide a layout for. If you put it in the root (`pages`) then all pages of your Next.js site would by default have that layout. If you place it in the `pages/blog` directory, then all pages in the `blog` directory will have that layout.\n\nA `_layout` file must have a _named_ export of `Layout`.\n\n```\nexport const Layout = ({ children }) => {\n return (\n <>\n

Welcome to my site!

\n {children}\n \n}\n```\n\nThe `children` prop passed to `Layout` is the Next.js page being rendered. `Layout` will also be passed any props that the Next.js page would receive.\n\n### Overriding a layout\n\nIf you have a particular page you'd like to override the layout on then doing so is pretty easy! In your page file, simply define a `Layout` property attached to your exported component.\n\n```\nconst MyPage = () => {\n return

Lorem Ipsum

\n}\n\nMyPage.Layout = ({ children }) => {\n return (\n <>\n

This is a layout override

\n {children}\n \n )\n}\n\nexport MyPage;\n```\n\nIf you'd just like to _disable_ the layout, you can do so by setting the `Layout` property to `null`.\n\n```\nconst MyPage = () => {\n return

Lorem Ipsum

\n}\n\n// This will disable the page's layout\nMyPage.Layout = null;\n\nexport MyPage;\n```\n","gitHead":"5aaa47cbe0fae00b03542c809d5fc53487f2213e","scripts":{"test":"echo \"Error: run tests from root\" && exit 1","build":"tsc"},"_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"_npmVersion":"lerna/3.20.2/node@v10.20.1+x64 (linux)","description":"Enhanced layout helpers for Next.js","directories":{},"_nodeVersion":"10.20.1","dependencies":{"find-up":"^4.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"next":"^9.3.6","react":"^16.13.1","@types/react":"^16.9.34"},"_npmOperationalInternal":{"tmp":"tmp/next-layout_0.0.2-canary.2.14.0_1588372119589_0.7896691463141416","host":"s3://npm-registry-packages"}},"0.0.2-canary.2.16.0":{"name":"@artsy/next-layout","version":"0.0.2-canary.2.16.0","author":{"name":"Justin Bennett","email":"zephraph@gmail.com"},"license":"MIT","_id":"@artsy/next-layout@0.0.2-canary.2.16.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"","dist":{"shasum":"ef5c994d175a076c60cd4a2468f3cbf8245e8939","tarball":"https://registry.npmjs.org/@artsy/next-layout/-/next-layout-0.0.2-canary.2.16.0.tgz","fileCount":12,"integrity":"sha512-I+hNHeU1eYZ2wWof8M1Ls1l/VPL55fDfHEzgOLE14TlrXiaPD9sVY7BgmZRcVkJDZsday33PPzTCYaNFDC4JoQ==","signatures":[{"sig":"MEYCIQDPWWKkTlOCCRzGi7M2Cyt81K066ZIxMkL/3oNE8yOIygIhAJQWetdZQgDsG5hStzOlUWdciBi2esP2Cubg0s1e4u7e","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":15505,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJerKO3CRA9TVsSAnZWagAAWBcQAIbEp9UJqTcESinf+fG7\n6axdN6W24HAdV+G0XY398lVclissEXK0ge7OSG2FK27/oVphnZSgpuXV6rib\n9s5czcF7bb1DIRbCGbii6ZC9ghtlfhvAv5k1x+O7q7pTYQycijBePdZXgoR0\ndexvz3z+4qiKfApXvzKE2M1N43wByA7N4pawHLqgq51+T/X1BvlHxZuQSzTj\nFLxcfGth3s+zzLzO+7LtQZCQGRyQQA+0+IitTGVMrIWvOkmNqM5kSx2JiwZT\nlxyH5mYLhZoU2qR/xtLC2E1ShpowDIvjFg6azk1Bt3/s26BDnw017oFf3mg0\n4jlk8wqQt4ejY3dtGS8ZM8JTst39hr4Wj+1pki6Gzq4uXBrj2M1V6SBkuYed\nZEnbthgl3/O2dA5wpuV8vjV85cM7bv8DLEQ7/Ot2W2Q3NQ7N80HFVVbXaI6t\nYlZesEa4w1NuWYiUzw5JyRUcZ1ZWwOv1p27ahwlNbJROwG8hOs4i6ji9A26D\ndguTe11HeRVQtsqmuIrScKXTo0UBx2nYefXbBlL8I8GSRM236tuFnw4AbVVn\nkiNWp5pkuAWb9uNgv13ZxfmuAiZX+e/QY3PwpcAUghsuKO6MCB7g2l9luSAD\nxg2Q8X3iL5xbm3n4nMHb1BCQrLt7oMoOqgW2hqFhR5CBuxIF6yEyZJtRdp2a\n4wRp\r\n=mDQy\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","readme":"# @artsy/next-layout\n\nThis package provides a new mechanism for creating shared layouts in `Next.js`. Inspired by [this article](https://adamwathan.me/2019/10/17/persistent-layout-patterns-in-nextjs/), this package enables you to create a new `_layout` file anywhere in your `pages` directory to automatically provide a layout for all pages in that directory and its children.\n\n## Installation\n\n```\nyarn add @artsy/next-layout\n```\n\nIf you don't have one yet, create a `.babelrc` at the root of your Next.js project and add the following\n\n```js\nmodule.exports = {\n presets: [\"next/babel\"],\n plugins: [\"@artsy/next-layout/babel\"],\n};\n```\n\nIf you don't already have a `_app.tsx` or `_app.jsx` in your pages directory go ahead and create one. You'll need the following content:\n\n```js\nimport React from \"react\";\nimport { Layout } from \"@artsy/next-layout\";\n\nexport function App(props) {\n return ;\n}\n```\n\nIf you've already got an `_app` file and have made modifications to it, that's fine! Instead of returning `Component` from the props, make sure you pass props to `Layout` and return that instead.\n\n## Usage\n\n### Creating a layout\n\nInside the `pages` directory of your next.js app create a `_layout.tsx` or `_layout.jsx` in whatever directory you'd like to provide a layout for. If you put it in the root (`pages`) then all pages of your Next.js site would by default have that layout. If you place it in the `pages/blog` directory, then all pages in the `blog` directory will have that layout.\n\nA `_layout` file must have a _named_ export of `Layout`.\n\n```\nexport const Layout = ({ children }) => {\n return (\n <>\n

Welcome to my site!

\n {children}\n \n}\n```\n\nThe `children` prop passed to `Layout` is the Next.js page being rendered. `Layout` will also be passed any props that the Next.js page would receive.\n\n### Overriding a layout\n\nIf you have a particular page you'd like to override the layout on then doing so is pretty easy! In your page file, simply define a `Layout` property attached to your exported component.\n\n```\nconst MyPage = () => {\n return

Lorem Ipsum

\n}\n\nMyPage.Layout = ({ children }) => {\n return (\n <>\n

This is a layout override

\n {children}\n \n )\n}\n\nexport MyPage;\n```\n\nIf you'd just like to _disable_ the layout, you can do so by setting the `Layout` property to `null`.\n\n```\nconst MyPage = () => {\n return

Lorem Ipsum

\n}\n\n// This will disable the page's layout\nMyPage.Layout = null;\n\nexport MyPage;\n```\n","gitHead":"98a47d513a01e7e52fd9a154586fb1a99a0e699f","scripts":{"test":"echo \"Error: run tests from root\" && exit 1","build":"tsc"},"_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"_npmVersion":"lerna/3.20.2/node@v10.20.1+x64 (linux)","description":"Enhanced layout helpers for Next.js","directories":{},"_nodeVersion":"10.20.1","dependencies":{"find-up":"^4.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"next":"^9.3.6","react":"^16.13.1","@types/react":"^16.9.34"},"_npmOperationalInternal":{"tmp":"tmp/next-layout_0.0.2-canary.2.16.0_1588372406440_0.7908817554545615","host":"s3://npm-registry-packages"}},"0.1.0":{"name":"@artsy/next-layout","version":"0.1.0","author":{"name":"Justin Bennett","email":"zephraph@gmail.com"},"license":"MIT","_id":"@artsy/next-layout@0.1.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"","dist":{"shasum":"ffcb05e99f407ef5a150b46a20af331cb0b714a1","tarball":"https://registry.npmjs.org/@artsy/next-layout/-/next-layout-0.1.0.tgz","fileCount":13,"integrity":"sha512-axmi1UWk31RU377gkuVrxB1vF07LfAGqys48BogYzuvHZXgmmgc9XlygBe9IclSxS1t94s9xuAbTHaHU0Vikfw==","signatures":[{"sig":"MEQCIElniO8eIkVlVcjR8/gEPQmvwgoZXh3KfQzM9nkpFPjMAiBcBQ/ajx8fOWZcU2PSvVfR2ble8CoXkd0DjoRICBsJ9Q==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":16100,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJerKVtCRA9TVsSAnZWagAA4w8P/1AUkENHotwP/PccjODt\nEuuy+9gURv5dFNJlBq45itvGZNpBmYN86IKgF29mZuDDLK2SslGDVDkQwZb3\n1VLfxkfXSFyyzrncBcAMnmgkhMfAYhQV08wxLPy1UDBNqhU3ja4ih/74BRID\nqbr1jy5kgh9eM/xWw5ecf5ty9w+Bt3aiCV2enPqqmpFAIEyc4lQ4PVgTnpAi\nCx9rkJLMGOyCoXRjhHeaD43CMhYwWSOkucXoWFF3y/8iWx1iYUJj202uB3Vp\nmVPTynEUQ2C0ik9ldglwlk3FCpC6N0B49Qbc6mVGCWEzDE2iVDUG++jOh3eu\niVgNBIopk/1hp1yTao80omGNKPOyevsreT3cW7VuTv3uE5A6kvDJaDTN/ao5\n7tSI9GeIJ71liEzYTO44ay4PacAtFSyRDcWrJNdFCiwzuUZHsiK2iaGBG006\nZ8LVHnerSWl95aZQRlC+G5u00D8rDHtCsniB/eJ0EwFxV9NWkUJ6dKof6gj7\n7gL5hAPO/tAs8NrO1ynf0+oSvYukpb16Hpadhw6pL1CvBaAC3N6oClKrUOFh\nToWyjcRvjqNp0osIuEpOt0xnpSnxt6OU0o7oNfX2t/H3/O/LPQ+xtiOYfSTS\nMr6DV/cwXcFKqre8g0UnzevTV/wrivLWyKdk+kHDJTlG7kWQGQ+JbHcv7CNR\n0D16\r\n=IHC8\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","gitHead":"bcd13d4e66f218b8854f13f3e555ac6f96762b5e","scripts":{"test":"echo \"Error: run tests from root\" && exit 1","build":"tsc"},"_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"_npmVersion":"lerna/3.20.2/node@v10.20.1+x64 (linux)","description":"Enhanced layout helpers for Next.js","directories":{},"_nodeVersion":"10.20.1","dependencies":{"find-up":"^4.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"next":"^9.3.6","react":"^16.13.1","@types/react":"^16.9.34"},"_npmOperationalInternal":{"tmp":"tmp/next-layout_0.1.0_1588372844990_0.1657455013300928","host":"s3://npm-registry-packages"}},"0.1.1-canary.3.24.0":{"name":"@artsy/next-layout","version":"0.1.1-canary.3.24.0","author":{"name":"Justin Bennett","email":"zephraph@gmail.com"},"license":"MIT","_id":"@artsy/next-layout@0.1.1-canary.3.24.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"","dist":{"shasum":"1f07f4dad667c687e71647f3b817478f4fd585df","tarball":"https://registry.npmjs.org/@artsy/next-layout/-/next-layout-0.1.1-canary.3.24.0.tgz","fileCount":10,"integrity":"sha512-2hcsnf1+zEdFHFF1ET8SXf/S1LyfULrPlplDfD+UhpSRm4Z4SLzR4ITO6u9j8bXg7pn61dCrS3KLAIT2S6H9cQ==","signatures":[{"sig":"MEQCICiDwNyzZTzuWYrmv1AozTW/pDebSHQqCLcYOzeiNaUrAiBm/etO0S3kVCzX1N71BjCXyzSOF2pSC/oP595BkGLsnw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":10809,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJercgFCRA9TVsSAnZWagAAMwcP/jhqbq6SNDdsvxacOzPE\nrB//gBxt6YbQhDG/7caCNefMIXdcl4Qp6u00FTsOgNbsK/Xy1UARnmkw5hiE\n6WALUqmPZ9+C+xk0Wrp+pNgpYdz2Xl6dUcLpjBDGQ3eOBqZ4QwyB8heb9mDO\ntYL8+E4GoQ4v1IHvO+r/FkBum6EqIEUPLsZMCZMm+VLEJ60Qe/dkw8W6JvI1\nenZSXDTxuh5SCSR8/cJH1KGOxa1rmbZcqJmKlf5sEVl8zKLFZWmPFVb6NZK9\n3M2LGBkEF9QUjd+u7f+fH36AYNpmtEzs90RJQEJFqMep/zt3Rg5DDPAeKs5L\nCKzhdbasSSzqojJiHI38oZwSV6AOEA7bzhIS6+iNHLLxPGyIiJkn03xY+Euy\n7bH6oTOvWOB6PuSqGBiA0eU+qQP4s+TwApox5U2c48G5mQhfH0BL5wA9A9KE\nMht5jw3zcMHMsTZbjGaYf+AppXhh6lpZ9kAFj/NbDqna49PAM2iHhUaPVevg\ndsIEMI2Vpl9B3tatSS5JEq831jPNvhqX2iL+lrwMSE63O1y8IbwMEWAUmRMp\nEG09nEv+/qutQk9kJlvyDPzyeuUYjRZprGmUqUjVCXgDfp6Or3mO0RETPtXZ\nWwum9vf3JyV9kqFeT41Ux/nOHvhazop0f2Kc5W7aNdw62IzlWeqO73LNQKjp\nKF0/\r\n=AVlf\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","readme":"# @artsy/next-layout\n\nThis package provides a new mechanism for creating shared layouts in `Next.js`. Inspired by [this article](https://adamwathan.me/2019/10/17/persistent-layout-patterns-in-nextjs/), this package enables you to create a new `_layout` file anywhere in your `pages` directory to automatically provide a layout for all pages in that directory and its children.\n\n## Installation\n\n```\nyarn add @artsy/next-layout\n```\n\nIf you don't have one yet, create a `.babelrc` at the root of your Next.js project and add the following\n\n```js\nmodule.exports = {\n presets: [\"next/babel\"],\n plugins: [\"@artsy/next-layout/babel\"],\n};\n```\n\nIf you don't already have a `_app.tsx` or `_app.jsx` in your pages directory go ahead and create one. You'll need the following content:\n\n```js\nimport React from \"react\";\nimport { Layout } from \"@artsy/next-layout\";\n\nexport function App(props) {\n return ;\n}\n```\n\nIf you've already got an `_app` file and have made modifications to it, that's fine! Instead of returning `Component` from the props, make sure you pass props to `Layout` and return that instead.\n\n## Usage\n\n### Creating a layout\n\nInside the `pages` directory of your next.js app create a `_layout.tsx` or `_layout.jsx` in whatever directory you'd like to provide a layout for. If you put it in the root (`pages`) then all pages of your Next.js site would by default have that layout. If you place it in the `pages/blog` directory, then all pages in the `blog` directory will have that layout.\n\nA `_layout` file must have a _named_ export of `Layout`.\n\n```\nexport const Layout = ({ children }) => {\n return (\n <>\n

Welcome to my site!

\n {children}\n \n}\n```\n\nThe `children` prop passed to `Layout` is the Next.js page being rendered. `Layout` will also be passed any props that the Next.js page would receive.\n\n### Overriding a layout\n\nIf you have a particular page you'd like to override the layout on then doing so is pretty easy! In your page file, simply define a `Layout` property attached to your exported component.\n\n```\nconst MyPage = () => {\n return

Lorem Ipsum

\n}\n\nMyPage.Layout = ({ children }) => {\n return (\n <>\n

This is a layout override

\n {children}\n \n )\n}\n\nexport MyPage;\n```\n\nIf you'd just like to _disable_ the layout, you can do so by setting the `Layout` property to `null`.\n\n```\nconst MyPage = () => {\n return

Lorem Ipsum

\n}\n\n// This will disable the page's layout\nMyPage.Layout = null;\n\nexport MyPage;\n```\n","gitHead":"3d4d3e46160e10546fab70dd135695cdf7cfbae2","scripts":{"test":"echo \"Error: run tests from root\" && exit 1","build":"tsc"},"_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"_npmVersion":"lerna/3.20.2/node@v10.20.1+x64 (linux)","description":"Enhanced layout helpers for Next.js","directories":{},"_nodeVersion":"10.20.1","dependencies":{"find-up":"^4.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"next":"^9.3.6","react":"^16.13.1","@types/react":"^16.9.34"},"_npmOperationalInternal":{"tmp":"tmp/next-layout_0.1.1-canary.3.24.0_1588447236614_0.4395284862638935","host":"s3://npm-registry-packages"}},"0.2.0":{"name":"@artsy/next-layout","version":"0.2.0","author":{"name":"Justin Bennett","email":"zephraph@gmail.com"},"license":"MIT","_id":"@artsy/next-layout@0.2.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"","dist":{"shasum":"52db4310669347b9fd99b084b55ceab00f59e9f7","tarball":"https://registry.npmjs.org/@artsy/next-layout/-/next-layout-0.2.0.tgz","fileCount":10,"integrity":"sha512-Ftq3Ipj+T7sbueJqUDgG8pWIgd9T4O4e4RBnHK3HW0Dk1yOGrFLqPu2s4XTmYWIXejJu2YNOMNwDZIK3H5bcKA==","signatures":[{"sig":"MEYCIQDyccBbXEv6YY/HdHULBRRlWlW+21yVEW2+usdpcstKGAIhANPv4gT4l2TuDeLtXz/ma70bHMsTsYLkWyMduvCb0k7x","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":11837,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJerc4kCRA9TVsSAnZWagAAIPIP/RevSEEVFHcEu013Hg5/\nsx75l/KLGAoRU4pCNJy+UfQEddnM726SxtMilesmsCClcYTxxUsVgNMYRwEu\n+mZapkZc6BOieprPYCXgCMpqQHRH4Z6PslyTShXKXJfFR8LoiSXo8zE5h7Fk\nGiMEOqhyootD6nJ8+poh0JnvDj+uo2IFh3RIlPK/7otraCfmU2pUlG+ad6mK\n8j62geZ1qsYoaTTKeOzM/R6wuIzTR9b+MPznU7h0cD7KyUhmW87jw33J4/EA\nOtuTkX/+FR64ishGZQT5wZDbUzU3a6gt7+sowBxt6A3ssg1oUEYfu/RRWi8U\nFAVmt338YuW519KFfUzs2KiI/YjCtWWWbW4JzzG+8rletjszANkZD4x43WDS\n2X3pkoTr3GfznZoYV0a77resDSuMvKmZ/S9+SQ+ZdA0Vmy2uyH/bOYkrFjjT\n43w7iaotGeSPOWmlLIK1v1JEHFweM6DA+CNence/XJbWFtFXaO/wOG/vycKj\n8nyNhzOc0O/0SW/NYViFq4pyGyMYyL2vuXcerARtn75KB1HDC6ijgXRyUHc5\ngur/ncI3ta5gHW12yvrsZakNUiCPlGGWIEgUabzSVUQguN7j6XJgiZG+8oGb\nCRZ6Jh+OKaGbO54t09J1Sjk/ConKFOOfeWXJoRJd/KArVmNXInYi2oFho5Jo\nn+US\r\n=W1OV\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","gitHead":"b2902cdf593266d28ab9979451579b94950dd099","scripts":{"test":"echo \"Error: run tests from root\" && exit 1","build":"tsc"},"_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"_npmVersion":"lerna/3.20.2/node@v10.20.1+x64 (linux)","description":"Enhanced layout helpers for Next.js","directories":{},"_nodeVersion":"10.20.1","dependencies":{"find-up":"^4.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"next":"^9.3.6","react":"^16.13.1","@types/react":"^16.9.34"},"_npmOperationalInternal":{"tmp":"tmp/next-layout_0.2.0_1588448804102_0.4137978721799225","host":"s3://npm-registry-packages"}}},"time":{"created":"2020-05-01T19:00:26.848Z","modified":"2025-11-18T23:26:17.747Z","0.0.2-canary.1.10.0":"2020-05-01T19:00:26.992Z","0.0.2-canary.1.11.0":"2020-05-01T19:08:50.472Z","0.0.2-canary.2.14.0":"2020-05-01T22:28:39.703Z","0.0.2-canary.2.16.0":"2020-05-01T22:33:26.536Z","0.1.0":"2020-05-01T22:40:45.132Z","0.1.1-canary.3.24.0":"2020-05-02T19:20:36.995Z","0.2.0":"2020-05-02T19:46:44.308Z"},"author":{"name":"Justin Bennett","email":"zephraph@gmail.com"},"license":"MIT","description":"Enhanced layout helpers for Next.js","maintainers":[{"email":"opensource@artsymail.com","name":"artsy-engineering"},{"email":"anandaroop.roy+npm@gmail.com","name":"anandaroop"},{"email":"mzikherman@gmail.com","name":"mzikherman"},{"email":"dblandin@gmail.com","name":"dblandin"},{"email":"joey@artsymail.com","name":"joeyaghion"}],"readme":"# @artsy/next-layout\n\nThis package provides a new mechanism for creating shared layouts in `Next.js`. Inspired by [this article](https://adamwathan.me/2019/10/17/persistent-layout-patterns-in-nextjs/), this package enables you to create a new `_layout` file anywhere in your `pages` directory to automatically provide a layout for all pages in that directory and its children.\n\n## Installation\n\n```\nyarn add @artsy/next-layout\n```\n\nIf you don't have one yet, create a `.babelrc` at the root of your Next.js project and add the following\n\n```js\nmodule.exports = {\n presets: [\"next/babel\"],\n plugins: [\"@artsy/next-layout/babel\"],\n};\n```\n\nIf you don't already have a `_app.tsx` or `_app.jsx` in your pages directory go ahead and create one. You'll need the following content:\n\n```js\nimport React from \"react\";\nimport { Layout } from \"@artsy/next-layout\";\n\nexport function App(props) {\n return ;\n}\n```\n\nIf you've already got an `_app` file and have made modifications to it, that's fine! Instead of returning `Component` from the props, make sure you pass props to `Layout` and return that instead.\n\n## Usage\n\n### Creating a layout\n\nInside the `pages` directory of your next.js app create a `_layout.tsx` or `_layout.jsx` in whatever directory you'd like to provide a layout for. If you put it in the root (`pages`) then all pages of your Next.js site would by default have that layout. If you place it in the `pages/blog` directory, then all pages in the `blog` directory will have that layout.\n\nA `_layout` file must have a _named_ export of `Layout`.\n\n```\nexport const Layout = ({ children }) => {\n return (\n <>\n

Welcome to my site!

\n {children}\n \n}\n```\n\nThe `children` prop passed to `Layout` is the Next.js page being rendered. `Layout` will also be passed any props that the Next.js page would receive.\n\n### Overriding a layout\n\nIf you have a particular page you'd like to override the layout on then doing so is pretty easy! In your page file, simply define a `Layout` property attached to your exported component.\n\n```\nconst MyPage = () => {\n return

Lorem Ipsum

\n}\n\nMyPage.Layout = ({ children }) => {\n return (\n <>\n

This is a layout override

\n {children}\n \n )\n}\n\nexport MyPage;\n```\n\nIf you'd just like to _disable_ the layout, you can do so by setting the `Layout` property to `null`.\n\n```\nconst MyPage = () => {\n return

Lorem Ipsum

\n}\n\n// This will disable the page's layout\nMyPage.Layout = null;\n\nexport MyPage;\n```\n","readmeFilename":"README.md"}