{"_id":"next-slicezone","_rev":"169-68613e810e050f7576a93881aac0e71d","name":"next-slicezone","dist-tags":{"beta":"0.1.3-beta.3","latest":"0.2.6","alpha":"0.2.7-alpha.2"},"versions":{"0.0.1":{"name":"next-slicezone","version":"0.0.1","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.1","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"edb1fe99a439da5d4b89e377cac751889023da1d","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.1.tgz","fileCount":12,"integrity":"sha512-EirikBl79Rl1yROiIi6jt2y4iTfgQUdwsQwGuRaB+awib/mPfrM8sdz8PvgsbLufs6AfnflwycJezTEdjhI9bA==","signatures":[{"sig":"MEUCIQDlgiLw2FnLHyIpuzbJfR0gXijdJgseYP5gv/Nsubp6oAIgf/GrCAgTeoOOCn9yM3coQNHdWUoKG6xw/w+aOfzKNA8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":18688,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe50yQCRA9TVsSAnZWagAATHkP+wVAyJ9J58TQJ7sRzzi4\nnHWX2jjmhHMP4Dzo/tLk9zm/DjqEBUhkzWcNyhEEGbe56qc3l6ig7ZUpnkwK\nXjAlGnuRR8Z55y9HT26QMvy7lHkYkWjrDDvqLRDHAvrGbHggM8CGbSz5lDtL\nkgKtYSji5lYULp9j2DsEClFMjOjcd1PznAvYndNrCSRwg+T/xSjGZibfdWX3\n/TJGXxEeKlzjMLybkDcZfUccmnNODqkKUG4UxDzD5H7XOQaQhnxH3DT917kY\nIjQ+w4+qoIYM/QS72gLCTGsqrE2IOnHYO/JxSX65GheldoKivVXPpssED2qh\nkwBSYiKk0AhgFhL44KtlQSDWiXk3Pib7KTo/nELvc/kARn86GNwy9bF3i8vq\nZOUDeWz5iVXx1L6ssWHUQzIPpJcTlsARVV73e8u2AHJi487iaLqroGp6mxhp\nuO48bn+WpR4u3vetbbKTrDsoC0jXks90VW8hpD4T1HTbXp9RNkm1u/XqTmrx\nzcTUTy7Z3+ashBrYNvZSiaOKY1Ab5KTtK052mLNH7NIEU3I+3jGvjTLPUrrN\nI5q/5kVVuqwoVBegdV9YYmL/9NoXnSk+AcPXaiCfGhcBToO6cxe3uZWaf0HJ\nVQoTmQyOnHc8FhuEDI6NqpY+ev4PVhDhrwqHZUm1bElbJiALgQoumQtyIu21\ndpOk\r\n=r4aR\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.5","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.1_1592216720313_0.5605628283256694","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.2":{"name":"next-slicezone","version":"0.0.2","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.2","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"32e73d1b31a26db9d415100c6e7ca7ee49e579ee","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.2.tgz","fileCount":12,"integrity":"sha512-hvodhNMJCtjwhtTRKD2qJw0QU07AoEODsZZ/QHOKBEdFzNuB6gnC5F/FGczAghofg8c7HsHCaLsTLOKQ3uiH+A==","signatures":[{"sig":"MEUCIQDdEC3XYsYUsLJ1sVzOVwxFCH3I91X1CjHBjcINjH0mAAIgdsto2OSd8xgxYKmZ7GCACFcqhpvUE0gRqCr9i/yu+PU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":18679,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe7M/uCRA9TVsSAnZWagAArQAP/1Uvf4AQI4kvwgUs5YcG\n9Lyph+y5vmt4QY4VKpV/Vl+OHEkFIR1A9TJWIeVvF1cHr/WSwHgQJ1IYDMuK\nS6023MCvn1GcLgwy4N+Nr42EIRhNAhYgGB7KAyeQpK/K2D5GTnebb5mhXRUc\n95Xbgq9Dz8y0EaQh1c2FM3aiQFC58D/I2TMWjbmDcQB015/yALs497IqzDob\nKFJHrNNWwN6zwcqB3bVyisOmlRsmSf28dYR6BFXU/jiYm+7R6cHoGWs8J4L8\nJpnfbpOh4hFQ5r2ihqrPx/5nUbm1w/Ktgs/mtKk1QjjbFEB47OeLrhYMO8ay\nQq8bQvEzRUbAYt+VynQEcMtMEJPzQo7FOzaqECYrQyRJuX7Dh6Iq5LX7ZG2D\nUa418Vlhz+RtURE/bj85ocJ+RMKuxmIO6JNJ0kyEUOYEDChGBFaegO+auVvb\niiOcGDcBNR7+LFv9vI65ipzKI6y5RzPnK1bdYrgW/c06e55vsMMSqlwq2W6S\neBGIbpH4EylDGRwvMzJjrN7Bs2p+LY0vL+JDB8HJx0rFp10dcjTS2H1o+LGL\np8sywuBpKSNYgpn7m1p1r07fynpTDTalI5JSKX9EfsCwXZ2J6owEsT3uA+vy\n+iERhpPZ7qJusCX6+AM2xXCeuXuZmcvE7oyKY/lFwVIck0XUOKSopoLCy3Z2\naEtR\r\n=Cq+M\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.10.0","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"12.7.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.2_1592578029799_0.44563492502730706","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.3":{"name":"next-slicezone","version":"0.0.3","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.3","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"9915359ba9e3a051e7739d079f0818a05eb580de","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.3.tgz","fileCount":14,"integrity":"sha512-x7xxKbw/U2L7r49zQJoo+0V1iSxIBC8vZmvTXmhl5GQnSdzkWDW/U2z63ntE4c2pA075e9WC3wCI5AaDimh3iw==","signatures":[{"sig":"MEUCIHNSIgpBY4atWyH3vO3Ot5wNfS6VwQ9GQoThdaUinXlkAiEAxu02UJzJsA2BL4KJ382CG3RpgzdJD0issiWsuW1sUYA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":21038,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe8KVuCRA9TVsSAnZWagAA71sP/RLBS/X/YYQBeNI1o+6Z\nLGqb3Ny9aU17+JV+M8/q0e+SRX+V3MF3fNcQ7pw5p/6u6N6xgz3jXpPNUNdU\nA4shNo8JC2/doxbcpcsntjfjvCm99Qi8rJJFNRyfbzHBfz35nv6Q/J7zGzoh\na1G7f1dJyrVTPUUK7dh3wSXEu6pF74pKFuU8lV8x393ms5eoY2TKK9JlmIN3\nmxp+OvihYNWoofhoDXfGipx2/koAbNuJu0pfMT3Fr/nskMmr9P7J+SCjZ/Jt\n4Z2eqPVHjLFxxQTfVBAig/DFL4McgkmW/kMDh0PyqS/2HURYFcVQoeaHLEwE\nP6fiocZVZenIt5bm0Vxw8glyOI1yMNTFEPhS0FdGE8vmffOMQAmqERZuBP60\nCkv7/fuOLc4Iww5XfiXtRjbwK/wJrC80NpG4LqySFx2BaMMqlWlBqvkGTpw7\nsib29njxfq8/jR9A5IMpHYPO8SHH+RJFCgWK24j0oHR34UNRwK4Qb9AgBaLu\nPI74giOhkldaF3ZBx1Gb32bVUUBXwNt8YpG1+gUvaVZa7ByKhUsvqYtyOJ6X\nhwCtv5ywk+/k0bq7o8304rCr0R2FWPX4Y5aZgmXAw0IJvjSAwBzi1DKDKxca\nk8NyazMz0+kHTLX34q7BxDtm4sCSQeKqpsD4LkoGB5zhKbVJTCoUlnBZbcEt\nbfxK\r\n=mVaL\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.5","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.3_1592829293869_0.9132903618976389","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.4":{"name":"next-slicezone","version":"0.0.4","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.4","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"bcecad443a1758d041c5315fbdf1c35dc0875846","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.4.tgz","fileCount":14,"integrity":"sha512-IFCJVjzA70Jlqeq+o7G+XbiTecGiYfZUNdp+q3FN1cr0VkYPIRUAm3a34H717IK/a3YGqpz8JhxWQodBOH8/Hg==","signatures":[{"sig":"MEUCIHrmv8QR535ondq2TnH7qfG2UCFXp2MhHQSSH/ONjWbVAiEAuA98FFc8c4Hq8/8w5DJYUzGqkB225fKoIc9aeYPFBkE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":21066,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe8L3eCRA9TVsSAnZWagAAdeAQAJGJla4hqQmjuwwFD2wt\nPhG5xSFM6r8PEBP0BtYssY+YZX67Dm3xmBlhJaCZwWvQwyqnfZLXcUvUg8ji\nUcv0Pc5PMWFZE0JtpylbVJ5m3pduGed+wKLVdXHJ2SGXqqDfVSkvruOsmiH1\nlurDcgj4X1pfWFjazx0zOyI5ngoMMrvIjrGMngoM9Pn1F2/cPxyOCcddJtEg\n9Noj2R5+d8O2jGQ6GeUUn6Ct94O2T/SDgFdIg9FF4PtbcRhUMsjRpPMJ2C6o\nCLjbfYC/UELO8MNBAbZz23d5MIZX1oueKYk1OvryPM0sFTlwYLZ9nONnEjBZ\nyyi30obJiwQCNDlQyIi8QvQWtWSNt0z7kf+g9KWn6e9YLnkXW+y1hSWXWJbI\nWWCScAoKtC8XpHMuv6fsBl7YIdXpA7tlOQJnoK+gBdVksC7Xfg8l45Y9EAjF\nj3vqGFSXJbYBTJIv2gpoljfl3ajEyheGFv3G6f6Xr0PW1awEeg04GYLSLmZu\nyvtSZNo9cBs+IZGdqK0259ReUQ9ZEE8SSFOkPMMXIMKEZyQLhui7o0MDXguG\nspBE7w/MxDZYdhVRLPNPkx2lLeuNXsizxXYD/p8Br++tLJH/xUmVD3tqtpGq\nIRyZL3JUGUy4ShOoE2YpUmmBhRFIeWZe9ujrSHfqBIc8geoZRuticMIjXZ/9\nJieX\r\n=1sbd\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.5","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.4_1592835549992_0.4034231035074547","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.5":{"name":"next-slicezone","version":"0.0.5","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.5","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"e82426f3d6e0645583afb18bd90c42b0c313e4bf","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.5.tgz","fileCount":14,"integrity":"sha512-TYevwdJSkRIZU126haTwvR/4LNr45VYTqSZWxOFQ2OeEGVL2WSF0nUVQZezbf/d0R4i/9d1EF4a622BIZ74tVw==","signatures":[{"sig":"MEYCIQCGLToexqQkqLBY+JmCSCdFPYrCyh7pghRA1qX6V0xK8AIhAMRq3PehOJcAJJ/RyPX6ruoSmYxAjNiNchQlOX7czzaO","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":21148,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe8McACRA9TVsSAnZWagAARmoQAKN/UUTSgXBv2AIk8zi+\nLpNWYcFgb7p+qLVTWtElSYve8GH6lqV8hXscyove6gXznclXMA3AZSWYvW4E\nzdyHT/0ZPeQ+zrFfgnZZW8bm7JC1JeXEA7AuiEZjDI5ygzLuhGdMhTleVXZL\nzMtooGfzl7WGyU5HPc63w2UojtxVaZ0DPDfFKpeMGusapF62VW2MpDWZgygj\ng8adELcXVhiFOgSFPPyVMZJ9rZIt8njnSaMf7AtVKOEw4+yEKlKVLyzMGqTb\nZ/59bj4iOXBMoL+loc3+C8EGTUD0vEZgDnv57AS7BqvjUqxa8pT5irmcIn4m\njNG8IsMq7BAQ5aVrekTPUC6r1xxbvqJ2qt9pXpB8xYI+is0q+cx7s/g3nWAl\nAOWNcme90d1nvfTpWSfkX9/dHCR3YYKKHcjTfFWlHKLJ/+WqsvqWy1hhyGRO\njhD5RuoU6gSQfW9iuy1/n/WgTExLrT8OiCtnCh+IRcUiHFFCrDdefYSKsSF3\nrj+Uo6e2+/HKDkHoHQfXxgY/iz2fGa3k890hg/+yVRP0y6+CALbnwuq/zjZf\n/x0raxuwwki618Keswh3ynGePkatuQHSA6WiHPOgb2XldQ22p0gQYBFteUbu\nrPdO7jyxisBirZ8o5/tBL4YRtkKDOUw4ZiJY7u0qT4OysAUSdJ77rudGqRkl\ntri1\r\n=Tokp\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.5","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.5_1592837887524_0.3863937861195157","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.6":{"name":"next-slicezone","version":"0.0.6","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.6","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d0d0532d62f5ab04599d507fcafe87ef30e7e1a3","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.6.tgz","fileCount":14,"integrity":"sha512-my5kVq0pDxeTal41LZzserSNzlkR+qUUvTwSQV8i0EXnACwQ1WZNR6pF1axTWEhFiMr1EGgJQqX5hfRE92Q/3g==","signatures":[{"sig":"MEUCIQDXF/Jqcz9A3EZwEQsq3kr3JT+Wdztlo5QbSCOWg5vPywIgWWen+OP8xPqeHRkua3lQY8vRRs0C+orWoA0MgVZLymY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":21128,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe8NSKCRA9TVsSAnZWagAAbqkP/iqZcb8pHVIlHpYXuWYf\nVl+6//t5RlRVGYJ1l8mADotzsM/lOU188THeyxXqm9Ri3Cb1jtUpV55pX3gN\nGW/FUKm5FiORngDXrV95jbK84fYA39RsR616x869mqmCyXE1b6yXQQ27skxx\nPnL6V1C1wE1BPoIpwy7owOHzJJzHFTNrobybAZdF4JTfCzQFcvQTB+jv93Jv\nsgojTt6Q8UWi8PI5dOYyeioJ4bGPA07bwTaAjxRSzG8LIa92FxIONL5n2oDn\nxXVJNnFwSHPErets6UcKu44WZl+Vk5vGiyCXzzLZrkQDtgRQFdxmmj1h+/F5\ni4QYOVKD+CK/TA+RBpN8Df2QXVfuRUIxgTb2+hdPlP6z9V4Yl9tYJ5HJYgdd\n6pJTaCQ1vg+0jR1wouHFJPmah4QJHSq2u58oxgx2jTtz7PR6iD3xX4GiYZpk\nEOFWj97S3YNjuyFL6Xn8eAEX/vdiOb5Pth+qsrxVKJ7mT7JXhaVhWTb/MJM8\nULANm4XhtfVCGBvsrf3EPrZv3KfGl8Y9mlXy5okXIQFTp+BUyLABQkp9p2GZ\nA8m/X3GXFvdGwcJuVJBVeeLoeIFqHCRsyB3gecAMrm0YS2rjxA8H+fm6j3uU\nyaBSunCwo8nnjj1Uzh7JLW29vbT4e2r73eJtniyd/4PtnzAbLQfsFVTc5y/5\n5/9H\r\n=KxaB\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.5","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.6_1592841354398_0.2327273227812512","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.7":{"name":"next-slicezone","version":"0.0.7","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.7","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"0c500bd22692b5d4a2080f2ee580862e5dc8fe80","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.7.tgz","fileCount":14,"integrity":"sha512-vxyKy3606ek35Kj4aLH3EAVNbzQdN+XZEyFbsx3Rvyxnd5KTopjgDZHIW92omVJrmBHvpFv3sj47N13su1UosA==","signatures":[{"sig":"MEUCIDhOITPUTpNX6BaUXTx98L4XCRNY6Z+Ewi2AgrIZYfz0AiEAr+XsFtwDFY6YsdxoQll2kQh518/WH5iOPqP5YXw4t60=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":21289,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe8NrZCRA9TVsSAnZWagAAzPUP/iYG7U1g2hcqPjD94zZw\npvbGdm00eMGKBmTlUdDJIUwGjM7W6ReYFCLz8yEWjiI7WjPlseOlBYaum5xW\n15H3bDMercP6E8HxEZFlx6mm/6WRJA8IlzZZ1p6wUPnpZdXrSPGrwZlekL+V\nj3cB79hHoik441pHxFxJuvUbjar9gvqUeSe8YOoqo6aQGZbA4S5LDiI3XGXH\nwvSo6Inyl70z4BKFYBCMsyeoJ5IGjjF3IPkxeuY8G0eBxl9b06SCjrrINS6g\nQFXN8MvSFTP7VDUVZ+ZCQdTmJEG0pvp+qgWNCkse9XktqiHb5QLhUCzK1BWL\nLasUHAMi7Aq/kJk4wEK/p8jKuPPgdhyEwMcAzkvIIXH+T8/uW9fKGsLtSF7q\nq3+xWg2whfqJA1in2fOrLZqaCWe6jCSVuqXzFCvyfp3hLukYNFJCqp70zdRZ\nWOdYXtMPbl13qL5iswuraS5KAqQtrYR91RILxBNJCWsOuxQf9yZk+BEcK4K9\nARCW7uFfvMRmAcRaTzbVlK5dNrYRW1P+Fa4WCdmkpyZ/zMq4VvwH58CriOet\nQRiePzkORbhZgaeTDyUS0V/sUcHdSzMjwVY+PQbvd6dK473FPCxNETnKU0hw\napj253poUFpb+vTo+RU5oNkqjZIVS7FT/3rxm8NLJpWTTVcnq1GznfgezRB1\nMRH2\r\n=nwwl\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.5","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.7_1592842969110_0.05471137411723426","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.8":{"name":"next-slicezone","version":"0.0.8","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.8","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"ccdb85e483c9f91eb28292b1292c3ceb02657645","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.8.tgz","fileCount":15,"integrity":"sha512-lhEOPulmBFMqu6A6vXONEd6W+fZ/Q1UXqtm2gGh0kDvBCHbjlYCv0MAk87n8rUbbbc6c5AxNp0ibKK8G1L69fw==","signatures":[{"sig":"MEQCIExzuWkNQ0LI6FxwVYmG42l0QbepBi6tCAHyho5jHPocAiAcj+h2kgQ0Vg/MJBp0u1QIQvZXHSK3YhampRpZVPNlbA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":22219,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe9J5jCRA9TVsSAnZWagAAiFAP/RV5lCc+kZ8siDTtCgVi\nqxdSeUEvCe9OJXvBZPjoYTHk3PAxKLjT8C4ZfJTcleqWoWR4SuudrZPsenRq\nbcFXaZ8VZYGi3zhX6Gf4MqZk4s+UaTTWb+TLXN+T2x7H1hiyhTIFzXBUEYii\nMUxIIaVMfclt1p7S7YrMKAeto44QKhUI3R4RqJAFHBfc0RNmtNYY9g9DBZHk\nQQVvD7hLt3YSho31cN8+2ecaRKgnkm8hwTt9P5B2CodJhl6DWwN+AMNm7Myj\n7yGKVHurlvzAMPHiEX7HykIXwl2iyiW+99fQnR8Tnzz/ra2WN13FTSgc1Bjy\nQJhFUT2rqVR4ZW9njRuTGwPaYH+jcLVlWKepHDtJ2RgQgO6kmWXxHemABo/v\nEripWYjpDGlErNQSzytpAQR/0kekR72p0CGJqK32RRbGQc3C0itbcYoHOFvp\nB7Ytp5hRYNHrQVpoGPFVTIF89afF33ocZeVHaxMt7m2KGBFsEI58NNjvfLdt\namYNWLcAM/bq4+mzY/4uZTVbRJsKQlgZZnLNyCiv8nldFrtkMaYPwRqpWfTm\ng7cgaMbfhd69doycP3zro+RIqZoc862KDN55zg91RA747WkGU+cYTnGIMEb0\nFbDRzHgktj9JaKNxv8QaAqt67kSQpAemfkxtroISYZmPJ21Xk80rsj5aBxqZ\nPr3y\r\n=FjT0\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.5","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.8_1593089635048_0.5684054855096545","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.9":{"name":"next-slicezone","version":"0.0.9","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.9","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"bc98a897950e2bbd32601141ffb9fcbf97fe857f","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.9.tgz","fileCount":14,"integrity":"sha512-AzjP/H2yhdJR52GEqbPl43vyhK8tUNsMJwUPqlPSD79Ask5VIZ7d6o9YA8DB6pJ0ntWAayfR0D16vveEO3WGfA==","signatures":[{"sig":"MEQCIDq99r+12a3tTxGK8fHimRL8U4NmwrgNH0zwVdEc5lLaAiBm4LcXC4GWa7x71cBY+oTkz29vv//KD9GRcqkrjcTrGg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":21134,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfX4YSCRA9TVsSAnZWagAA8W4P/3spw4b+idocJuXjVuQC\nh5H1OVcRDIJ75OHhbdgfhF8oClvwLI/t0nQlHCBSEF+/aEvKDZYx9trUTKie\nxt7v8RRXEpp5rnuQPFwnce7lWov3Sc3GE+9sxb9SB+kpDl+aQtCnX/u6NAHj\n78RN/fNr8QFvSTtNKwwY5Woy1QkA+rF/7hRmpoisTCLBDVAAXtpkb2299WLK\nRxYiPNto+SdPmfDAOem7e73sX5b1vYJfUPYUuAQb3zmse6RINliOqjKpypma\n3ViTBKn1/36OWT8iezff1PziItzGQJb66db2JPD23Yll4n+ODsRkakZkRxAo\naR9AlMk7i5KE57uIuzKguIdL6qysIzuRHnMk14awn/VGvSsCiB/7ibifQg5/\nyFx/K9mCK4lzVQloJPZTVJmFzvC+hVHs0KE3V3XFTMYBTNa1rpLMrbu5N6Dr\nDlPfr2sIfXnPUOuHo9eyCeiZPzNnZ6Yc5z4ApTv9B+UwdB06BrtsBzP04B1B\nH9Pg1GUz1Kb41eOGHzSeWgEIqfduEak/aNvKPcWL92k4QmyVqZbVtmDtVIWc\n8oyR0GWIGAfVjaHKGhAc/hocdZ7+9/EKB4mvgJV0Q7fTxxXFaPrGCdof6Mc5\nCKSt6/vJlnHNq47DzpkNkUKMQeWs6EmQz6L159vLVe3iFh8FB4LIk5jYJBAo\n3h2e\r\n=WVaS\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"e60188e14400f74869f9aa040ae90cf463b760de","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.20.2/node@v14.4.0+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.9_1600095762266_0.004665562424247094","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.10":{"name":"next-slicezone","version":"0.0.10","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.10","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"713de46fb5e462c700933824d71553226b792484","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.10.tgz","fileCount":14,"integrity":"sha512-YI7jY7JUZbWxYdUJg0OS84OFSN9BuwlOO5qXg3mvfWyfwVx1DzHBxJFaAPw0u0oQeneJrLwnG4x4fzZe2oUedA==","signatures":[{"sig":"MEUCIQCCaW9JgQakSAcScWp7DHIn+BJTlxnkzgjZdI/qaqb8iAIgRCQmt9PFw5XO7QlYsveIuwgFI484JCdeSzlHB9WxSNY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":21248,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfmEkaCRA9TVsSAnZWagAAhB8P/RGz9JP+6h6AkmWgWVSO\nJf/uA2NRmtxjjktH6R+FcgJXIx70NF7/J2fC7ATVrPEvmiJl+tGTi3NODP1Y\nSnEIG1zF+6G0e8ViYY9wU3mVGiL9W60biIl5vZu9g0GdDCY1qdBdDixMuXQa\nLsL2g2KT/pLukE2QMp+sjp5nOhyVedCpeoHiWSkdTBXUQBGClTc6oXgoxx1f\nng97JLCH4B26aLaMQzZbjTAL9oFnsmaRcazVcDBNwCDmY6ViQ/h6CTTvNSHq\np8O3hRhtVPOSbllQ16HssSX4ShOI4vmQYv3XA93nqz6vPXgwcBbwfgc3mxWL\nHVYChT6BX2AW2DCeiDVK5Lo6H+kDTtGadalcxLe/f9Iwkca3Ii7yXtkfVjBD\nLBYyc18SebQnqfgaVn71dNHoat4Huxiodx33gvIzwOXCs4da/GhPyP6jkj7n\n8zXJ9GhH+8ez1wNCMK2+iZK6Cux2cPkNOsfUgI15BncFpmTTiBS8JjDhty7M\nnhk7BOtbwTpBqQhS9yWBuiYw0BSdgF4nz3ytG1kNDkM2INcDOF3WG4NqWONJ\nqLMVk6pA3sDePS1oUxQo3xp47AHgQpR9ac1LTSEThdbS7XCHefZKycgOzFOk\nrjRkA+41JzAcBZ6SKwk/n+QtG4LWK5rZenI8iv53u11N82dSe6ikzFI1C6hE\nkACr\r\n=EWD2\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.6","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.10_1603815705531_0.8534927166639883","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.11":{"name":"next-slicezone","version":"0.0.11","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.11","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"41b0dfe4970014472fdb1a0b7a354eb187b4abd0","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.11.tgz","fileCount":14,"integrity":"sha512-xeLrAxhHZ15l7Wy0Nm2Aqrc5vVUtrpsZJ7Inx6kSY0Dp/PO64U6ZF3WheScmnaofKxBKXUFDHbZfh64eWxoQCA==","signatures":[{"sig":"MEQCIHnGhheRwjx4n1KtVyI4vxLHtRr1hKN7L7jZMzuK05FlAiBh5qQw+xWUJHtVwPe16+YTznhS3JtyXF4fRLPOVpDblg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":21414,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfxlLnCRA9TVsSAnZWagAA5Q8P/j4NINUx69ME881GbLjH\nNgPxregUbCqQ79kwx5xFo9qUKDhngu69OVtt1CZcmvhyXC6BkGFomFN3xWPJ\nJaMp7LdjOoUFJnspfMg7ykzRag4i3d7q6o4KKYsCoOnw0VBDVEeCGZywX8c2\nl5g464vxcILuzS92ky4PGryDvi+4mu1OG3lV2AIPFQ8O7wOrysQblt1XTVKv\nPKfnh7418x+ANTa/v9RNyfwxAwUbCWY2F3eQ4yqqAYFQ/IYtGV71CbGAQsJ6\ngjKkTCSw8FDH1scqS+nnx2eJeprLFc/Lwn1X9sBzu1AzIjpw8XAERMm9RJBE\ngx8mQCZG4z9J7Dv89g9gtLVOPL9475UnrDUDRO+QbbxT8zvV6BkfDNn8up4i\nQkcN05DJcFUVeyZNXkv6DyGxHTSQfGjbJikIxxzzlfRNv/w2s5Ap11leGxgx\nPY+lpE227i41naWy6XPTWHzIEjLHBVoAgyh6Ix+jHD9pPvsibQCXrpPyTKQb\n7+Apqz3+d4phJmNfRudvk+7AgFsboStwvjyLhUzg2G9z/0894BL0JLmBnTPj\noxXK9OTmgc4sXsAxERgGNBvngPPMB+gV7HsPDyHERL8wwZwt07KkscyzhOit\naMYO0PDKiRdAmrpsUN8WsLK1AK7LvLugocjt7px0uUpQxEyhJewuwx1IAoWx\nPsT1\r\n=W6Ta\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.6","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.11_1606832871150_0.8107194709282917","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.12-alpha.0":{"name":"next-slicezone","version":"0.0.12-alpha.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.12-alpha.0","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"b599e08e90105b8bacd133c1dac19b7218d742e4","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.12-alpha.0.tgz","fileCount":13,"integrity":"sha512-0GRhqUZbs2BV8NiyDHqZKHg+FZ4AH5Q4Cwi/Aw0DVBN4QcZFAJIqwL/o1qwXr8yZEBDYu8s7n6HWo1zhwfEf+A==","signatures":[{"sig":"MEQCIH2UeWn0h2bUxg88xy327EEJvJO8J9PFrfD2J+KMw+gDAiAymTlQzdI+MJMQSXv/yvCB86udg7BJsszf6H+i67nttQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":19074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgCEXRCRA9TVsSAnZWagAAhuUQAJj7qJEBDvvHoDCRtEqi\nWLrq9hvmQHi3SBAMgOq8RAdZDRe5IU5nZsAQIh4rVkGR1b86wv/dcw7F26lP\nQ1rtM6+okDOz/jgi6GtPvuU5V3GZ6e33FAxlAPt3w9WDA/rg2wd9Qz5sr4+v\n0DePGyh/rz38SbsynPHeJJIX5RqvO9gq4guqQ/FYldSKkO9UIEHQ300NWtM0\nxduwLNi95AujwrrjaJiB/XI5qS5eqvOWo5eDQkohdtnq7iF2Ivp+biqZPVaF\nLsXec3CrSbLE5PctfH5ilH/Z8s3P7yeolSE9ftBtrFNFM6jHkfPBMHAGhlrJ\nvtchRRBVpTamo6qfoZ0QK2gR0opsG/0gO8Tk7NoyYIx0FvZi+5pfdhO5svuy\nPvqMgF2cNHhrh36tEIRyU2Yt4fMjnNTGoD9Z9a4UKwdzPi8nV3KVIOr7DbP5\nRgqGiLCIMdM4FWruwumtOkg+FtBzac9XwJO3ot4N2u9sPoXvGZp+TwRgYQXX\nXZ4DpcI797xmkkgSrGSVl26fam8Q07obWbKPE3k+177XdN2qvPcKwrXnIiBQ\nNyqb/w0iu9obr/SHzuA0mcf18qG7yyxLpTxfmk1Oi10eoQt9CbGBURYY58s1\n9QYHxqqVKPu8yxr4P4yy9J63my3mpekpY09xU3t5c7YIBo/kaC4GT/WPXAkW\nTRzJ\r\n=NA1h\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.6","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.12-alpha.0_1611154897366_0.1775409660142253","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.12":{"name":"next-slicezone","version":"0.0.12","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.12","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"e014f4bfb26bada91dde96f793978e2a879a4892","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.12.tgz","fileCount":13,"integrity":"sha512-75zU1OSro56KTUg2hmg0LKy6D5iRYrDLqWg0ZP152KSqrd/QXgxD0ObCRwxbpK0SohegbsXlmqTRSG8Kdesktg==","signatures":[{"sig":"MEUCICAsuAqzOIza+nSpPCG+AErgTCGzmfH0v5ZieZCoHlxuAiEAwAUiHNGofmRN0HviOk+uoJ14XQwPhXbA0Sf4ChGwiXU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":19066,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgCYqACRA9TVsSAnZWagAAmLgP/1qeOSJ0Zy3bsQN44Nt6\nQNLUGd+xIy55HZQoChsy0HXewbIu2nX5usS3xVV4BDFFDJTMlS8S5wDg/ym1\nzfU23/DkYWoQj+wjeNdHY3OIrCSZasDBasd1s3PhnM+VBWxo2sRyBblpswFT\nwBf2laLAlzlZsLf7Vjimxw1exR9e9rw1jQXgePq+GJHd6vT1qlk/5AzSATNj\n/udSc7FN3zFpDAdnNjKrxi6NokcZO23YfNTNp/CMFXzR5Qv8zge+JrlaWrPe\nTaS8DIXiMzoEi+aktlKeOu8gOx6bRjufViXj605cPydA4iKoFNdbFUHKhOlh\n/AhMsIjb7kydSK3ZoGg1+0DS+cK2Qx/aHspK6VeXlhfJOxWTOk2kJ4h+bv8M\nwdiEES8HzLdATrhRzDA570DBtdXRn/TBEntQN0fg9hcEPZDh09cJPwYefnJd\n9UDhen+rtaSQNpIIuCjaG/HeQhT7ubuK6SLbTFGBiL6rtZXbf8HqafZlsM/0\nxrBqAr3gRKTBhvgbKn4wUnsfihHu5Y4hgNxbjbTNX50oCwTk1qgWOUwx1h3F\nCzllXbMnpiV4rdYMAzHWtDtMG9H7pHM7Q5NlGnAiBOkUDjLM1JTgZ3x2ucdV\nb3JiyHxkQLIGKS5s/NYCUhUQJlVGL8TzH06WGpRxtjNwJ/OXUv5/LsbsvieA\nRtvs\r\n=Y737\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.6","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.12_1611238016447_0.9854197289030144","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.13":{"name":"next-slicezone","version":"0.0.13","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.13","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"a0dc1fddbd877b95576c1ecfb18f3f78f4dc2d81","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.13.tgz","fileCount":13,"integrity":"sha512-k1aWN3Gl84ekxZVdUgzSuoPDIJItuOrQgSwfwUhBAh8ftZ9kwI6Cqc0i+uh22fQL4RNKVdRx6WMYCU6blFfJvA==","signatures":[{"sig":"MEQCIG1+XpVu9to5frGcy7UiUZWTVV/yGum5Lsf35z9U8NlSAiBodWUKE39i7KD+DeaxFZs3JCo+jdIYUh/4n6P+cFq0kA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":19065,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgLTh3CRA9TVsSAnZWagAAqbAP/j8LoWS/+fqnx8xYxmSm\nfboA6vlOSAUspNh0u91y0K4evW0Ebu5JucDgQUCUhB3i9iwtCitBCNGHJ3t/\nBnPwHzvOzDOnwQIgx8JbCXbd27CLYSepbsRTIWMxZGVe8k+NvRuoHmPjw3MJ\n4ZZPD7wnWfVVsefl78KG8rVDW6WslHTzdDvSJOpgvqiPrqnamSAUh+vWr8eP\nQw4jj9QuosALqWCCPiQCphLDb7UbeKRDO+UGpzGsWtvYYgzSm6PQlLel5u20\n6rYj1m/KpZyKha+HH0iMw/9GQ66QLct1ULTPHMA3Td6IxgekR3qLBOv+Y55d\naAtn0RJ44yx4LtlavWsx+y8BWOujhFCve2DMsEXDwXsAkYg1ryJAWoOwmmF4\nntDlo2dscHXXy8IXbufcsw4qpq7xpqTi77uLYHeG+r1u22EAv/k/Vmh/Blg9\nYy0hB2EEBaEfIAWoHcqvPrcYgQyueZNfekSZz8JFrril5B3fJT/skPzeh8OH\nErEtjpZfTy/U3LC6Eg/uV2DScwooFJRtKsuLm6qATETwX1WmENBgRz62Pq3q\nqXJy6bLij6cJA99x33DcAkC6etys3wXEXGcnAA6Bgqpye56io0+TG3ZAQTqc\n1fsW9zMdbP4kJOjeWD2RIZOHnw5Vggbvt+yixoeJsXizdVn5x2w8atTQAKtP\n6Kjl\r\n=G8fb\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"lihbr","email":"hello@lihbr.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"6.14.9","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.15.3","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":">=16.0.0","react-dom":">=16.0.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.13_1613576311107_0.8491125942680582","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.14":{"name":"next-slicezone","version":"0.0.14","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.14","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"1e4cf611a4459a38203ea95522de602d2f373ae3","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.14.tgz","fileCount":13,"integrity":"sha512-pcRXjlF3WSaR7KBH7BHl7quUnhXBfP1aX/ncQNHlseQ7r/OM78UUE3dingrov9+oTK/oRGSveue98xKl79YGIA==","signatures":[{"sig":"MEUCIHQIuLQl8CvgBd26H/pgto+xcIBcb2SAEeKBGm5lyTQoAiEAzva9oxQv2pPIHyVSF3p1rbG57tiaaKzODbHIHV4EDz4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":19190,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgPQmlCRA9TVsSAnZWagAA/HQQAIDmOzkBrKpCVbV4mQcH\nUmN5xRK8oxQF3Z9XQ7tonLAnHO0rncc+BqLIEsdOrR6GjR6vCSpyo2jkpuJT\nUIUuauuVFXoySvUv7mw56xWbykzkIm64klfQcvUADPoLTFaUHJRm1zChVs0M\niPctFjS8WO1QbrIllL1PaWQcNroU7oKlyC49lKrXBThGB2k9DHjG8NeA4RCu\njpTsg/p9zUJczbJDkb1N2nvjxCZaX1oUcWovlCIvQKvlm+m13GO4B5+dKfAw\nbRsTDJOea71cw3Dmt4baEkI9wG3F8oRlhaBtcijbSDUD6Qe2K4vhh4l9iE65\nM0eEwwlkJBQD2SwLx2ANvz81thtrUGmKKB/7Zzse0Be76ajFlZt/VvcA4rz9\noaAQh4yyQliyM3NdlYqTgtPp0xh39iJPn2dLjsQfhYlCk2pv+jnFmsZQyPwy\nVeI3lxHrJU+TiqNOjZGLlUOyqmkjRAVnOwihQuBObg6Jp5ATE1aQHvoaNK9Z\n8KYH3bn1V5rx07sl+BCztX7rhE8BpEn2TGr6Q+FNfh9cHls22fuwH8VurZuI\nyS6fTtwLuK5UfApMpyLclP5LcjGjKwCg5hqytjbj6kGSYGjGex9hAXZeQbkJ\nGVwdt4Y2L6XmC1cOG090G+N5v1UEYcAdRAS03h2WNwHrtb8HY72K357IBm9O\ni4gQ\r\n=Ctba\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"7.5.2","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":">=16.0.0","react-dom":">=16.0.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.14_1614612900886_0.5129035609111168","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.15-alpha.0":{"name":"next-slicezone","version":"0.0.15-alpha.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.15-alpha.0","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d9e6ffce88e43468cbaca58b0530c20d82047542","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.15-alpha.0.tgz","fileCount":13,"integrity":"sha512-fhMQ5KRRDXaxBsIFfd8JwtTgYUpqhJeyfS/Zd1a/Gjt6H3DhW07NC5IiT0vizXb/gp1DEU/D0YDNX+OAXarP2A==","signatures":[{"sig":"MEQCIEt9mwADkv598D26t9CwmRV/qshMqjKLxwIkpj8C99tMAiAiI/Eg84SGbGNqkW8qwD+w63DrN4UMcLzJJjkuiupwSA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":19451,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgPRN1CRA9TVsSAnZWagAAnqkP/iaG7wXglw+VVHJzRGvC\nnWOYvkOFHZA0KEZS+YSJw1kTkufL4+LPvSHIPKQqA7a/RUSoGkS9O2O7yCbb\nRRs+6xCkltAyESSVlHDHSt1JtdNhAgegS9iR7vd3p0I+gSNZMXqNhLO2mwJQ\ntyvuQGAyO+p1+wsKAh2cjYcDxhcBdFQVxyzmDkqIyHHWOhEuLpT6ka5KdN39\nsfMU5ZhjH/vbBlMjm9/O+vmEAyk0wTdmuOxfJTnPxvDMiZZZ7jXM8pBOLSdW\nF1URAjiZSu4tBuWICqbz12vfnD94q2fTsGB5qOdvqgesUwbfUegJcYqDI22B\nV0pIvYyi/WtQCuMZBB+pF5p1Yrckewn2CiH/6C37GNAcNXrUF3vKZvOIlnE5\np3SgtC3Yc5Y05PzbLbzbYYX9xdvJqUSHSDkGIpd9t1Ft4sBrk3+uXr1jjDlM\nOI9/DWICRvsbUrxZzntkouB3winZCKcklgUyzpMSdE8btiWp3QRP0jhCelOP\nypoXRft/xSZK4w0yEQB9+r9xADCQs523RRT2+drloNipdC+iB4799SmUCrP7\nZUQWpkmz69CdKoJVf9ACpokd0GgrwaANe7PfVBF7wkkqjMEBfhIrFYzP/vKZ\nW0UCPpZRGilU72Nd4QvERVN4B50gMo+1rkDRuhCeO2vRiuqVO/AOQxkl5Unn\n7k6F\r\n=ZMU6\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","readme":"# Next SliceZone (wip)\n\nA component that matches front-end components with Prismic slices.\nPretty much a work in progress ✌️\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Status\n\n* [x] fetch content from getStaticProps\n* [x] fetch dynamic paths from Prismic endpoint\n[ ] Handle dynamic imports\n* [x] handle previews\n* [x] Create registry\n* [x] pass custom resolver\n\n## Usage\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `theme`, an arbitrary object passed as prop to all slices\n- `resolver`, a function that resolves calls to components from the SliceZone\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example _document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from 'next/document'\nimport { createResolver } from 'next-slicezone/resolver'\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx)\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === 'development') {\n      await createResolver()\n    }\n    return { ...initialProps }\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    )\n  }\n}\n\n````\n\n⚠️ If you don't already have a resolver file and import it in your page components,\nyou might encounter an error that should disappear on complete reload of the page.\n\n## Hooks\n\nThe SliceZone exports 2 hooks to help Next.js statically export SliceMachine pages.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### example\n⚠️ Signature is subject to change\n\n````javascript\nimport { useGetStaticProps, useGetStaticPaths } from 'next-slicezone/hooks'\nimport resolver from '../sm-resolver'\n\nconst Page = ({ uid, slices }) => (\n    <SliceZone resolver={resolver} slices={slices} />\n)\n\nexport const getStaticProps = useGetStaticProps({\n  client, // pass Prismic client here\n  type: 'page', // query document of type \"page\"\n  uid: ({ params }) => params.uid // pass a function to `uid` to resolve dynamic content\n})\n\nexport default Page\n````\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param     \t| Type               \t| Required \t| Default value      \t| Description                                                                     \t| Example value                        \t|\n|-----------\t|--------------------\t|----------\t|--------------------\t|---------------------------------------------------------------------------------\t|--------------------------------------\t|\n| uid       \t| string \\| function \t| false    \t| null               \t| If queryType has value `repeatable`, pass document `uid` or function            \t| ({params}) => `/pages/${params.uid}` \t|\n| lang      \t| string             \t| false    \t| null (master lang) \t| Lang attribute, disabled if `params` is passed                                  \t| 'fr-fr'                              \t|\n| params    \t| object             \t| false    \t| null               \t| Object passed to client `apiOptions`. Disables `lang`                           \t| { lang: 'fr-fr' }                    \t|\n| client    \t| function           \t| true     \t| null               \t| ATM, you have to pass a Prismic client here                                     \t| Prismic.client(apiEndpoint)          \t|\n| body      \t| string             \t| false    \t| body               \t| Key of slices array in API response (`doc.data[body]`)                          \t| 'nobody'                             \t|\n| type      \t| string             \t| false    \t| page               \t| Custom type to be queried                                                       \t| 'another_cts'                        \t|\n| queryType \t| string             \t| false    \t| repeat             \t| One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls \t| 'single'                             \t|\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used *in each dynamic page* that relies on the SliceZone.\nIt's responsible for:\n- fetching documents by type on Prismic\n- \n\n#### example\n⚠️ Signature is subject to change\n\n````javascript\nimport { useGetStaticProps, useGetStaticPaths } from 'next-slicezone/hooks'\n\nconst Page = ({ uid, registry, slices }) => (\n    <SliceZone resolver={resolver} registry={registry} slices={slices} />\n)\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  fallback: false,\n  type: 'MyPage',\n  formatPath: ({ uid }) => ({ params: { uid }})\n})\n\nexport default Page\n````\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      \t| Type     \t| Required \t| Default Value \t| Description                           \t| Example                       \t|\n|------------\t|----------\t|----------\t|---------------\t|---------------------------------------\t|-------------------------------\t|\n| type       \t| -        \t| -        \t| -             \t| Same as useGetStaticProps             \t| -                             \t|\n| params     \t| -        \t| -        \t| -             \t| Same as useGetStaticProps             \t| -                             \t|\n| lang       \t| -        \t| -        \t| -             \t| Same as useGetStaticProps             \t| -                             \t|\n| client     \t| -        \t| -        \t| -             \t| Same as useGetStaticProps             \t| -                             \t|\n| formatPath \t| function \t| true     \t| (doc) => '/'  \t| Function to format Next path argument \t| ({uid}) =>({ params:{ uid }}) \t|\n\n## Installation guide\n\nThis guide assumes you have a running 9.3+ Next.js project, configured to use Prismic.\n\n#### 1/ Create an `sm.json` file at the root of your Next app\n```bash\n{ \"libraries\": [\"~/slices\"] }\n```\n👆 This will help the SliceZone locate your slices.\n\n#### 2/ Then install the SliceZone\n\n```bash\nyarn add next-slicezone\n```\n\n#### 3/ create a `[uid].js` page \n\n```javascript\nimport SliceZone from 'next-slicezone'\nimport { useGetStaticProps, useGetStaticPaths } from 'next-slicezone/hooks'\n\n// you may want to do this somewhere else\nconst client = Prismic.client(apiEndpoint)\n\nimport resolver from '../sm-resolver'\n\nconst Page = ({ uid, slices }) =>  (\n    <SliceZone\n        resolver={resolver}\n        slices={slices}\n    />\n)\n\nexport const getStaticProps = useGetStaticProps({\n  client,\n  type: 'page',\n  uid: ({ params }) => params.uid\n})\n\nexport const getStaticPaths = useGetStaticPaths({\n  client,\n  type: 'page',\n  fallback: false,\n  formatPath: ({ uid }) => ({ params: { uid }})\n})\n\nexport default Page\n````\n\n\n#### 4/ Add a slice `my_slice` to your \"page\" custom type\n\nIn your custom types builder, add a slice with key `my_slice` and save it.\n\n#### 5/ Create a page with uid `my-page` on Prismic\n\nCreate some content using your `my_slice` slice.\n\n### 6/ create a `MySlice` component in `/slices`\n\nYour pages are now synced with the writing room ✌️\n","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"7.5.2","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","peerDependencies":{"react":">=16.0.0","react-dom":">=16.0.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.15-alpha.0_1614615412961_0.33771844075325075","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.0.15":{"name":"next-slicezone","version":"0.0.15","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.0.15","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"78503a9b95c73c1d13804915e14481b831ee6ce1","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.0.15.tgz","fileCount":13,"integrity":"sha512-HS0oY/lEQy7L8TA6V3opZa7NreccCNBmPumiOHK5dAiW8RRD8fHte3u7EM6U243fGr0Ua+L47/pZs6OHxdRX1A==","signatures":[{"sig":"MEUCIQCw8LKxf8pfYPY3it3tYhVgtBCmDMoydOhxqCOGK9VcxgIgf1ibdwl3eskkQcT4zIQfgbYxD+ReLXIlhM6/yDlFiJ8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":19859,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgeD08CRA9TVsSAnZWagAAghcP/1wIN7U26y9DrkvHeiqf\nXtE9xurj2NrrpFO0cS0wcn/T/gUqC+ZapGrxdA7+SMn0fqLD1hh9m8FttBL1\nE7uAcHBdQ7oV36GlhwSe79PRQU3kEj6Ci8G5GZjjp3IlrkcbbtDAkddk/VYa\n5jRlFDhzmc3zlnbBLujBTQZ/u95h03/nKWwhLO8pcywM3W53gy9Xttg8AvqD\ndtE7L2d0uSjedlyKiJTh7pyE6p+ghIgMdrZgGdi9aAcdS0S8OrU6vRHLqe0l\nvmc0drZH+MUXQbJPKvSIhvDJSZM0bZ868S8mTmuWxjq3X8sJQzH1SStwsmhE\nzLH+BIgm2XBK2zWEKKHAmuLRuwDCIohEJQz9vn5BsblrS11zPsu0HH22jDj+\nDL4AWiOC+OU4dehSoCSYdsYkFgme+PnFqCqfzdfJnOgPm1vuvVqhf4bTkDIL\nFT1reYfAAPR4yweoodG8yAafedIbMueQbZLYiU4diXI9KGuQtSi30VKQyAD1\nxyIt1eAQy9SBwm+YxN2KGVdCfeC1WQYMgfa8OQBYHrJ8JobIHy1ZjMi8NZs/\noK/WkgIc8bQQ67hJ7M2srx4u4JJFD2jIkmh5KhEFKZ1B9hEXMPv8QYLzMZzO\nfokLuiIic9Y1ag9MK5LgWUpJVOL1XwoVsjyqr2A1e+mhcJCsIvpzV3tR7RGD\n9HYR\r\n=5l+/\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"7.5.2","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"peerDependencies":{"react":">=16.0.0","react-dom":">=16.0.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.0.15_1618492732271_0.28755919933888285","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.0-alpha.0":{"name":"next-slicezone","version":"0.1.0-alpha.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.0-alpha.0","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"64c373048cbd43f50f4f9934f94aa59a8250be96","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.0-alpha.0.tgz","fileCount":13,"integrity":"sha512-PwInbW49IE8/WBUaIl3cZqGVRW2R70m/SVAMtvoIupPRBEL/SvphBcmb8HaGn1G9Mbn5wORLUc59ABDk+r/3jQ==","signatures":[{"sig":"MEUCICEZ8r3V/VJAE/w/AcMVlwRIZYIWBjQ9G5DVtBzkU0m+AiEA3sQ4nM0mXNqu1Y5RYiAzvfbj4s5/SlcJsiNLtSYagFQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":20973,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJglVVcCRA9TVsSAnZWagAAng0P/2j9w68R84U8fVbgTPyf\nZ6SlKo4MWKs8fiVC5slyR90Yv+llL0r/t4IE5nlBviJAWrfqyXWVbIUCh8NB\n/6DIGB2RGrpspmGRcllvSWywgBjTLdqYvQEiQKwuWE7iHu6NWBV4VhXKxyEU\nTTj1JWFGgJA4vPWonRqGMpoOQ9JNie7dNYeHxRyliQMQT1IJAwJS/g+f/eSJ\nIGjq9WMGz5/8h3yUrXVU467+Wdb4hLL2X55Z0bwSojtkyxm+DdStlnhU3xzw\nX9MOERsawSQJxN8SYLYVzT78PWNaxxYeh87tiowE1HFHYijg00ZFnzrJGhoz\nHKzTNrKpJlRQ2wnYxRDS99WPeGAUHspZU607d19eA9kKIEVWyXKgB7T78GJ6\niSuoL8DxRQxAFadZ/xqLze7u34wkbozscdqqgU2kK5Fkyi8MbXqG0mJ6FjMV\nZgt4PJeaVzC+Lcnuj/yZyCc39ZlWqPGm/nSnNauGRHhn2i2gGbEWvCPQTXRm\nDJ2Pv0sVr1WgpIZZVuisTeHPvM4l63Xeq8YFSzOb0OyxuHrqOLra0woXq/GS\nIdY4WSIhdPE76XAlXIvtxCktAV75VU3pE6MWby3AWq6NpBnZzFqYe4jnCVfb\n4/Wh6fLDTcOVxZelaRUfGYbc4EI1rLTgLwYrKbtwjnvUTxJITPmQwTbX9bzp\n4Afv\r\n=mwaF\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n````javascript\nimport { Client } from '../prismic'\nimport { useGetStaticProps } from 'next-slicezone/hooks'\nimport resolver from '../sm-resolver'\n\nconst Page = ({ uid, slices }) => (\n    <SliceZone resolver={resolver} slices={slices} />\n)\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: 'homepage', // query document of type \"page\"\n  queryType: 'single', // homepage is a singleton document\n})\n\nexport default Page\n````\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param     \t| Type               \t| Required \t| Default value      \t| Description                                                                     \t| Example value                        \t|\n|-----------\t|--------------------\t|----------\t|--------------------\t|---------------------------------------------------------------------------------\t|--------------------------------------\t|\n| apiParams    \t| object             \t| false    \t| null               \t| Object passed to client `apiOptions`.                           \t| { lang: 'fr-fr' }                    \t|\n| client    \t| function           \t| true     \t| null               \t| Pass a Prismic client here                                     \t| Prismic.client(apiEndpoint)          \t|\n| body      \t| string             \t| false    \t| body               \t| Key of slices array in API response (`doc.data[body]`)                          \t| 'nobody'                             \t|\n| type      \t| string             \t| false    \t| page               \t| Custom type to be queried                                                       \t| 'another_cts'                        \t|\n| queryType \t| string             \t| false    \t| repeat             \t| One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls \t| 'single'                             \t|\n| getStaticPropsParams    \t| object             \t| false    \t| null               \t| Object passed to return object of `getStatcProps`| { revalidate: true }                    \t|\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n````javascript\nconst PageInFrench = ({ uid, slices }) => (\n    <SliceZone resolver={resolver} slices={slices} />\n)\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: 'homepage', // query document of type \"page\"\n  queryType: 'single', // homepage is a singleton document\n  apiParams:  {\n      lang: 'fr-fr'\n  }\n})\n\nexport default PageInFrench\n````\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used *in each dynamic page* that relies on the SliceZone.\nIt's responsible for:\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n````javascript\nimport { useGetStaticProps, useGetStaticPaths } from 'next-slicezone/hooks'\n\nconst Page = ({ uid, slices, data }) => (\n    <div>\n        <h1>{data.keyTextTitle}</h1>\n        <SliceZone resolver={resolver} slices={slices} />\n    </div>\n)\n\n\nexport const getStaticProps = useGetStaticProps({\n    type: 'page',\n    queryType: 'repeat',\n    apiParams({ params }) {\n        // params are passed by getStaticPaths\n        return {\n            lang: params.lang,\n            uid: params.uid\n        }\n    }\n})\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: 'page',\n  formatPath: (prismicDocument) => {\n      return {\n          params: {\n              uid: prismicDocument.uid,\n              lang: prismicDocument.lang\n          }\n      }\n  }\n})\n\nexport default Page\n````\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      \t| Type     \t| Required \t| Default Value \t| Description                           \t| Example                       \t|\n|------------\t|----------\t|----------\t|---------------\t|---------------------------------------\t|-------------------------------\t|\n| type       \t| -        \t| -        \t| -             \t| Same as useGetStaticProps             \t| -                             \t|\n| apiParams     \t| -        \t| -        \t| -             \t| Same as useGetStaticProps             \t| -                             \t|\n| client     \t| -        \t| -        \t| -             \t| Same as useGetStaticProps             \t| -                             \t|\n| formatPath \t| function \t| true     \t| (doc) => null  \t| Function to format Next path argument. Pass null to skip. \t| ({uid}) =>({ params:{ uid }}) \t|\n\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n \n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example _document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from 'next/document'\nimport { createResolver } from 'next-slicezone/resolver'\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx)\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === 'development') {\n      await createResolver()\n    }\n    return { ...initialProps }\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    )\n  }\n}\n","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"7.5.2","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","peerDependencies":{"react":">=16.0.0","react-dom":">=16.0.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.0-alpha.0_1620399452215_0.18964952689440162","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.0":{"name":"next-slicezone","version":"0.1.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.0","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"04d6b9285f25805701bdace661448a31e0e8765d","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.0.tgz","fileCount":15,"integrity":"sha512-Ytt8UERNf/UnSuXWx0fYeP8dlKN2pTZAccCaiiG+SLT49Y1spgnwp0fKZX47UoV5M6zvnZ5gWQnsOK8Ukunr6g==","signatures":[{"sig":"MEUCIHGlYrvwYSrFHte4aic8khEEd7FQzWO9xzsL8UaQzqTLAiEAgFX4G4RITnOwALP4Kjwbs9ynXlIn7AWgbSCXrW+MeWc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":23159,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg0gDHCRA9TVsSAnZWagAABUIP/3PVI8l0r3BfpNy99NUy\ndhMQ2yQGT9IUWFYl3r5T0E/dHErT4eh5eSkw1DXrfOC7FZJsLvlAedqLjpzS\n4EhcQ/lzvCehjy8grZRcJ19pqNikRL4S+DSzs6WrtEekwgYwhju75003gB2K\nUpM17mU0QVGmyV9Lhtfwg2AgPKYNoPuU4o9imMvo4hGI3tdCkCb5V2dJyq7k\nh/2TZmBM8zsfPRyVmLlE8uFMkG4XHF+REZ3lzOVFxzzXMvwvMLPDUNyWwZJ6\nc6tqWodGF19fB/Jj2NXUtd4zlWlBf72BXmQF9R8qUHuX3cuQasgyANL1INPa\nnL7J5iBP+a827kRRJ4ZJVUjjuaZzkrZvmjwp/Z2B+SlwEy2RWIanwmDR1gKq\nqlH62cVtKkNpIZxrPRpUz4EXOWbRDEYzuKqcmRy4hJYqRD2moEZAmxXoFfNO\n53uAzeP9TVs7vAyWXOqvYHX9M2lzwbc1I0QCDI1gpwb/caShYqbDhNpmW9sK\niWIt9XBEz5nrpPjyGHmbDzOXXbUpLVlbt0Ssd8cA/NOdCvbymhReeYh6EnV5\nQsQSJJtI5FQPC8hameCV+3vICojq46JyniKmUsKI3dX95GA/Tq/Myn2Q8mTr\nlyMWjvF5GxCNmjq8zWY3BTIXIhOdoq2Q3g8JpJnSWBDx4IDQy6ptZcvfUlLq\nh9Jh\r\n=w1oB\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"jest"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"7.5.2","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"14.4.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^27.0.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.0.0","react-dom":">=16.0.1"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.0_1624375494701_0.9863547535228656","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.1":{"name":"next-slicezone","version":"0.1.1","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.1","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"13b0bc841c061dd5395eea7b6191487be9c0a782","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.1.tgz","fileCount":29,"integrity":"sha512-htkS9YJdcp3qyrULWsll4mM9ytypdLYFF0fhC2yXAYc5NUPjqayfU+k+2yzq88yLkcSTPQIERZasTw2iLp/VPA==","signatures":[{"sig":"MEUCIQDEqm8vYCNHmtQxG3ZP83vEmGVHX8CAxovlsRqfggpGqgIgPrLHSA4WGN3XtN+62w+IgFRrDa1dufl2ryVJxmc/Bto=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":89278,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhCqOjCRA9TVsSAnZWagAA/28P+QBeUaXfJEKQuRLIKP//\nZhaBdef9DJSEKef0GMwWjUddLPO46eBvuvrLbCWuEsroZ2kqAaJDZhisH+f0\nNXzB1p7+4UdRVKdSCdKVVE7NvP0QKB0qcKL0me3QSi4tXB9qJLwLazXMuVqW\n2eCM9qV6odD4VZ5lGopFNKhn/g3+w5Vb2M51VPwYYxplG886n4Ry5l8iTiKy\nlBIDo6MqzvWEJwGB+am2OfuIndLa/glKdolIZCwUx0XhYBAKkylUgMa3gcQs\nTxiTy9v8d4+k03ErHn86oRk1Z9oTFeFez15B8taEYMVKyrxzn4SETlg7I/Ki\nOkoLF98Oyw8tXBmlasyje2/aPzGxMYmD52jiSXMxHy+cy+DZfXMhpyzdmyCV\nrOqi1O7OuyqCG9L85GTHTkrzIsGhNcA5W0Stij9i7p8czT8GtXthY7X5AlKm\nh59UnQOAyL1exE+02SnOoXAUNC/cmES7NGtngo3RhmjufckqE7rOeVkMbw9x\nkTtp+cfCVk/Dv7jpQ4i+dXOurC52HcczMSO6PXTsGMWV9CEJasQgvBxY3XiX\n21bRuWSUTDUe7qgTnjHZ2ssgcA7FSpRp9cQMWoRrMG67c2t2pTCI606Yd8hL\n0mWuhxAC6kgmRM2Oz/W5Zp4FBL+kX4lL7XF3aYFJCCgIDjyTF0szOe7AuNdO\nU2qv\r\n=9yeT\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n````javascript\nimport { Client } from '../prismic'\nimport { useGetStaticProps } from 'next-slicezone/hooks'\nimport resolver from '../sm-resolver'\n\nconst Page = ({ uid, slices }) => (\n    <SliceZone resolver={resolver} slices={slices} />\n)\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: 'homepage', // query document of type \"page\"\n  queryType: 'single', // homepage is a singleton document\n})\n\nexport default Page\n````\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param     \t| Type               \t| Required \t| Default value      \t| Description                                                                     \t| Example value                        \t|\n|-----------\t|--------------------\t|----------\t|--------------------\t|---------------------------------------------------------------------------------\t|--------------------------------------\t|\n| apiParams    \t| object             \t| false    \t| null               \t| Object passed to client `apiOptions`.                           \t| { lang: 'fr-fr' }                    \t|\n| client    \t| function           \t| true     \t| null               \t| Pass a Prismic client here                                     \t| Prismic.client(apiEndpoint)          \t|\n| slicesKey      \t| string             \t| false    \t| body / slices              \t| Key of slices array in API response (`doc.data[slicesKey]`)                          \t| 'MySliceZone'                             \t|\n| type      \t| string             \t| false    \t| page               \t| Custom type to be queried                                                       \t| 'another_cts'                        \t|\n| queryType \t| string             \t| false    \t| repeat             \t| One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls \t| 'single'                             \t|\n| getStaticPropsParams    \t| object             \t| false    \t| null               \t| Object passed to return object of `getStatcProps`| { revalidate: true }                    \t|\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n````javascript\nconst PageInFrench = ({ uid, slices }) => (\n    <SliceZone resolver={resolver} slices={slices} />\n)\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: 'homepage', // query document of type \"page\"\n  queryType: 'single', // homepage is a singleton document\n  apiParams:  {\n      lang: 'fr-fr'\n  }\n})\n\nexport default PageInFrench\n````\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used *in each dynamic page* that relies on the SliceZone.\nIt's responsible for:\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n````javascript\nimport { useGetStaticProps, useGetStaticPaths } from 'next-slicezone/hooks'\n\nconst Page = ({ uid, slices, data }) => (\n    <div>\n        <h1>{data.keyTextTitle}</h1>\n        <SliceZone resolver={resolver} slices={slices} />\n    </div>\n)\n\n\nexport const getStaticProps = useGetStaticProps({\n    type: 'page',\n    queryType: 'repeat',\n    apiParams({ params }) {\n        // params are passed by getStaticPaths\n        return {\n            lang: params.lang,\n            uid: params.uid\n        }\n    }\n})\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: 'page',\n  formatPath: (prismicDocument) => {\n      return {\n          params: {\n              uid: prismicDocument.uid,\n              lang: prismicDocument.lang\n          }\n      }\n  }\n})\n\nexport default Page\n````\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      \t| Type     \t| Required \t| Default Value \t| Description                           \t| Example                       \t|\n|------------\t|----------\t|----------\t|---------------\t|---------------------------------------\t|-------------------------------\t|\n| type       \t| -        \t| -        \t| -             \t| Same as useGetStaticProps             \t| -                             \t|\n| apiParams     \t| -        \t| -        \t| -             \t| Same as useGetStaticProps             \t| -                             \t|\n| client     \t| -        \t| -        \t| -             \t| Same as useGetStaticProps             \t| -                             \t|\n| formatPath \t| function \t| true     \t| (doc) => null  \t| Function to format Next path argument. Pass null to skip. \t| ({uid}) =>({ params:{ uid }}) \t|\n\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n \n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example _document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from 'next/document'\nimport { createResolver } from 'next-slicezone/resolver'\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx)\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === 'development') {\n      await createResolver()\n    }\n    return { ...initialProps }\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    )\n  }\n}\n","source":"src/index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"jest","build":"rollup -c","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"7.7.6","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"15.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","@babel/preset-env":"^7.14.9","@babel/preset-react":"^7.14.5","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.1_1628087203110_0.38948239768164905","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.2":{"name":"next-slicezone","version":"0.1.2","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.2","maintainers":[{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"0054e14eb04f137d7a96b7d69cd0002158802348","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.2.tgz","fileCount":29,"integrity":"sha512-nILyVK5oF0qq6eLpIlo7Jjymgyep4mHrFhrM365LaG5xa3pRdg10HSAE6E09jvHVEvYy8b8gkwUqXzFWttDu4g==","signatures":[{"sig":"MEYCIQCbx+1jQ4gGZ4V+B4uNZt/F238HaJQRgLoiXPB0iyjE4wIhAN0UsLPh40k+f3Xj3GMf/q/xgmQXsMzn6G6L5tkTX+5i","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":89278,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhC4uVCRA9TVsSAnZWagAAPbEP/26yA+0I6xoofqzo9Knn\nQ+yp9hj8OrnJr0KsnIzi/SOREx716lYM9/39loGOvDAl9AAGkwk5JSip11hf\n97agLhmMEV58b15gqpReAzmpeuCUGk1QMWF1zha8ei/w22UTMqPQG9p431IM\n+a61/su4gXvaBJlZFY8wYOu9MxZPJorzFdAB04vO4o+PaNhMPd14U/aROXUm\nQatfsYAJgYm2U2e8tsWlIqafcswj2Gm1IegZ2X6vb9FBrtTCeQ0gkLYQ/W0w\nV8q6HXGwT+cWKkZD4/UftGXfbaNzJT7PzzJ8jrBwNaRqplT2zHuBapkFSBiS\nQOQ4a64iYnk2UhErpzXFuYViWqZbu7sGIjdd2SxLEcCb6vL+pXw0g4yjQp2p\n/1RsKVyIfZZgElH25dyT8tX4CQkVPv7dkLMtAX21tnapj5GzYahm+fk6/occ\n1o7bGOyyFv/mGWcZHVXdpJ6SYWl0VTEUYQvF3cln1gP62gdGZg5vqgz/VlGn\n1XVxrodAVKZmnD0i6j+vRtAFERcIt80m65ZxFo0RmZ6n6VLh8dY9qrG684hc\neYXTp/MRIA8UhgH9OikBpYgFuxUC4ZTO+dkpYVISuP2+HXAzXo3nhDBnYPUh\nhgMZqIVnm5RB3j+cK3PKpyadmt0NtrT76t8umi42y+QSmiVid6Vnp6teTwBU\nCpA2\r\n=01I+\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","source":"src/index.js","gitHead":"58f9c3a4bd3fc23cf5270639829bfebeaa23bdd4","scripts":{"test":"jest","build":"rollup -c","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"7.7.6","description":"A component that maps other components to Prismic slices","directories":{},"_nodeVersion":"15.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","@babel/preset-env":"^7.14.9","@babel/preset-react":"^7.14.5","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.2_1628146580962_0.12324285633744525","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.3-beta.1":{"name":"next-slicezone","version":"0.1.3-beta.1","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.3-beta.1","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"c8cade128b2e01ddc08775ad441ac04d4da95df2","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.3-beta.1.tgz","fileCount":29,"integrity":"sha512-RcRRlexlwTwwzzDWAEnzEpX4SIyBwnlCYvJvwi8J6YzrIsD50LfBzbh+r7fe+O1mFCtpeREygMamrxMr7bjKfw==","signatures":[{"sig":"MEUCIHDAlxFnsruViolOaGgk1fSVhw8s0eAGStouKsAuMP1RAiEAncJavxmrw65uUkgoyiLAYWRcSbjde5KonCyPnszU64Q=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82867,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhnQMtCRA9TVsSAnZWagAAqf0P/07VN6c/8oN+QWno6cL/\netCE/vNJBkMHjKFxnOX0G9Gnc+QODfr1vrV7SPh5iOacbZdQX/gLnL6wWa01\nHnW48vtTyGnDQUJ/zldm7NKYq6co0IKfG9PG3gQMxcyMV6WhQGgp23A1GG+E\nyTnHw5a2Imxdpz5067W9C4+8vU+lj7Yz/6PZlpPJXlJfCb4DcP6uiY3CQYeD\n1kp5f0X2MY7Att7w4Nc4guBu5UNKaLiC4mafCEdfcmTWTEVmE3sUk55u/dP/\nQAF9oHPJuGNPg1YZKo6GqV58+/XyX6Ms5bRruZjyNdBgUwFKXv1X+W9w6L9o\nh/XyXIEadHppPMkMIB5GdSB3x2CE4CDKBd8eR047SokX34UovuuOWRiLTkwl\nqKmNDevENkS6F31PkTGe5484CovB5XlHnSMkVBoAPXMQny598DBPZhV9XhHw\nmYtFdX+R6TKosHHI5KIrBkHcNL+yoXRvo+5S5h/bpiofHhgo1UOx7rCvnH4x\nfcUy+IKBGk5p7DYE/9q1RhM3yS2E6wdY57QpOdNZlHhGidfBJCpTQZDlme4X\nBcjmaIdIfV+nQ2cZZPVCNRrIlp74NaSoUbwZyh/EtkScSPxxPvBy7odXkWWX\nKUp9vniaqYkeBCc8S1/F+9joCKJK10YpCjbsK7iH75BRaGTPPC3MvjxGdziM\nOuWV\r\n=jumM\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"92acc9952004d6a0e5536cfed72cf6f6b0305cec","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1005151","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.10.0+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.10.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.3-beta.1_1637679917698_0.7072626995004554","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.3-beta.2":{"name":"next-slicezone","version":"0.1.3-beta.2","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.3-beta.2","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"9da38e2ac122dfffc78e2682685d132b6310ad77","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.3-beta.2.tgz","fileCount":29,"integrity":"sha512-4aR4EUds5enensO6faZscxC3bhlLF7BAcRlHww2GcGC1rO+r+EPcDrfMOud7hPq6kg5JLtXligCuYCOHP5lAuQ==","signatures":[{"sig":"MEYCIQCaJyNyRcwIA8aSLlUE9fIyCIp9NxANcFzDSIs4jzf0BAIhAK6BEvNHiTBfj2fH6jUUD21I7knab4ayM7jzF5qQPcOP","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82867,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhnQ0KCRA9TVsSAnZWagAA4Q4QAJXc8hcfRUZ/4TOdxKPx\n+xY+eO5nq4yQYrPG8tYQzj2jTDp9Rk1UbFf1JQS4vm3zWSZJ/zFHt2WB+lbr\nKcsNC8kjffzDXd0G7yM1b3/ICNm9VYaEfpmwaiT0G6PoPnCVQVJImE8u6uWf\nnFoSJKoTgA1n9Ta67dkU2hP2slz1hNju9MRqcnX5f2UKikaxMciGoseDdvaz\nh6zWDfa6AhKFWTdrzWi4mADVeUReqiAkbTuSL3SxbzEm3Lp7F2TH5yoq3p/W\nzqmRkSQEKzHnPER1H8QUo8HBH+Lm7VVylDWtd23qv7MKPRsEj71zoOsSCrCI\nu8znEGPjNxSB622xdsTfJXXJfPmf4LyZGF0X7LudAW9xyzZTwbid10318Jko\n39WGPbwvmAn8JdcV+Abft+2mSQBLP+Qb8QKVRYY4EXXazhGb1XfFhDGGvXBW\nOszNH5e+TjyDP48ApAiSoW5tlEC4FSp29giVgRehdYjUMfJR37PjvGGy3lPQ\nAe9Q4clyx4R2Nh1AN42RfageWKiLrlhMIGVhcUFTtPRted7RHLVG/CDhFoal\nhUCePDWo86ot4F/oLKb1xe0l5e5chMy8vFyrfXKwgFwTieuT9+AkU1tWD0LR\nJ+rnfMUg0d4Wi4PHbUyR7mgrgjtUOF1nPwA+vnUlbO/w+fUqF0e9YGbSMeEN\nym85\r\n=3oKB\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"72eca26fbf1e5aa611df64f72054eb1d5ca30aa1","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1005151","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.10.0+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.10.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.3-beta.2_1637682442075_0.9463345890959192","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.3-beta.3":{"name":"next-slicezone","version":"0.1.3-beta.3","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.3-beta.3","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"b20396a513698952527bf6cd537f2d3f3931ed74","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.3-beta.3.tgz","fileCount":29,"integrity":"sha512-1lAa/9EXWH/eYvhwfKhotN9P3B/HpeD19Oq+ihE7LwV5EvPuQaLt/pyhRAk2++XN0beoJsCZHNA6JlwbK93R9A==","signatures":[{"sig":"MEUCIQD1ywOabIU33HkfcPNPfRC5pq57gDkWI5o2Lf2nSO6MyAIgVKuazjiI0sfbGrof1TjIz3Z1nmcaIX+QZw0K1qTNXDA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82867,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhnjkECRA9TVsSAnZWagAAMEQP/iT3pRm/g7Gkj/3xXUrH\nZ+QGaJSaM3Bd19aM1rIryo9wMjgITrMmh0iWzcGJiA7LRMiDQbf5FthrqlZY\n+TKh72L5fQiEW3MGIIiHEmdizB0aIUy4TZNn+koikvSSjxDq+X+jnJyTdQa0\n+aAjjbEIkGfzzsbQXk137qqrUmnhXL5nojhsG9lPJ347YR9ZLacrQeAm0320\nE3QXwIIvmVxS9p3Ak805LyYEI+D35RfXZlJviagI3EwAzO3KhxRUtU5tjNgE\n1Sztn0RGWLhgVzW/oxifdhKqyNwKTvhEdSgKx/vQK17W+GhsMA5NgpL/k7UV\ntacB1y1wX8sgcozS5ILWgokLunjeTz4NkOTTgLFfJ/prgplGI1sMf5w0StqP\n1NS9DRrBJLoCaKnRW+5q6tO4aK/iFO5WMOu0fRPhXlXNkUFQEPZGvELzEdfT\nPmmG3VzEl4el9k1YaLhXNBbU/u9TyqhBH/6A8g3vjm025k4cHY4tfr+Fao6k\n5zdcrCVQ0z0/P+A5PtWA6kE0oE2BNKSEbO6p89B9uOThgeeWj2xtxveWm8oc\n3JzhTIQOfLhwUTFU9GtPsca9BviRRP1O4kgmJMhOS6tnWzTrHp2DL+cj6K83\nWp1MiScX4iSp45UowHyyLOY/zyq0VVrse1dpyMfDSXSWwwsAzcZ0dgRbk2eO\naqT8\r\n=r0zL\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"225704f73651c79993eee368d6911f68848d7e47","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1005151","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.10.0+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.10.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.3-beta.3_1637759236418_0.8720756847666884","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.3":{"name":"next-slicezone","version":"0.1.3","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.3","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"64d9a08e570ac707655db665d3b2cd74afe23c09","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.3.tgz","fileCount":29,"integrity":"sha512-kx2sBnQPByv/I6+M23wDBt9OHWrYujjQAM3YQDFSh1K1RYbgN7qkAHBxOJxTrTR6cFkpUTDS1hx1t4QrhI43NA==","signatures":[{"sig":"MEUCIQCsU7XV6wTa0VlNavFSUYft2/3rqf5ZUC32D5HjRrJY1gIgW8aBbs0VdjchInBb294wzocnGCJocpIa9v2TlZi4WsQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82860,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhnmB2CRA9TVsSAnZWagAAMK8P/j5VEKam3HFEAE/liiYl\nNHB5vLx5Qe6Hbrlwwackrqmh3QssWw988PkjBhpwAi+lv0xLDPRWdoYeyaGl\nnnvezU5jQQQlQKjvQuZJsdrskYXCkfICGEHnIsIKhKy81/9tRy1W/jWp8x4g\nnm1BnSZR/HwpMnxXETQ67L7e3m8/8GOJJzkivi3EZ3zlLEtJi+v9UTYRxKGB\nvUf8Cp+qQADxV15kMC2C4UQFyaT+B8u05p46plxSyegOnxZZAN8Qe144K9Cl\nurpDzZlp7hBo+qkxfXBB4NUWn7jRJm10ttGXNLCG8kMtqt66O/jzJg536gJa\nYWe/7ZCM/dHpqsU8oWEjMZ6bZvcPZHJ92cXn7HnyxkSoTa9MDHr7t2wo9tcQ\njC7DM/jixMntuXmHn9qZecn/03kABGhpXq/iznzWGPx/Q5p/Ob98ANuXMxC9\nGaCTq7lgi5mMlKGy9c4b7LIp40btrUuczVMIL6rtrE7VhdAHGI40Fh7VTPF+\nT1/oSmMCKWwF+zjmbYD9M5Slmy/EE4YNWqjSCakUc5aENTfyemhhuNvihJ3e\nOqB0qxigeO9D4tAR3sE/2PvEntl0bK3aZ0BN15jN0BO9BhtIHgVmLv2yV5mr\nWgYPP8AzpMTG+PbjlFLk/V7WUD6HcJNZUmWXo/oLwMySNvtW3cPvCYn8dHmB\nV2C5\r\n=xOx5\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","source":"src/index.js","gitHead":"d4e82ed6f4bd7798f1047e2b4f61f7757b6de188","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1005151","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.10.0+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.10.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.3_1637769334712_0.6999160000873319","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.1":{"name":"next-slicezone","version":"0.1.4-alpha.1","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.1","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"ed778a9738a95a06b2e9090bada3e63db8d9fc94","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.1.tgz","fileCount":29,"integrity":"sha512-wJOpQCEyPcz8pYkfBb+KjSPvordGmytOpqWG3W5w75ypeO3DWEVBWWRVQYdZnrc5k0oJXmnAZ8X0Mv5Art1qjw==","signatures":[{"sig":"MEYCIQCrjNuinzCuyds54NfI3v3U1V8wHr2j/sO9MLUYAzx7dQIhAJq0p4bJmad7pVimkR14ik1VIVXk/93HwgwsYFaR4NjM","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82868,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhoREECRA9TVsSAnZWagAAz/AQAIADZP70QTwYQ7o9bVm/\nclBT6X9/E1yYTFZtjPVF86ZBKK5F7kg9uJDoK/NY3H5u6szM0DE4EEwPIMeP\neg+phZp0nBaZAUE6x26zqLXRQ/QWAT/O/fKj+8E763M7KZb0s6KT2qlqfBvh\nfDIRoo861eGvRqftc/cw7a+gxqPu81ryMP+3O974lD/ZxFxwQ2NIaqLhPm0l\n0w2+4u4b7XCI4qt2xhz1tpLBxV2HyzEG4IeEGD2esaYYHDgSU2rT5NfVVZQm\ntIWA5VdTKU5KjrhXjU4Y13J16AmSD6PEYmECst2GiuKFUp678kjPEE94Cnlo\n90dGwYZgKPLWiK0cyRcWMXRzAz+wZBU6vzZCVkMn3ILUh2eX8aE34WYc5ut8\neW5s9J8GqYCToyH90yHpd20K90Wj2AOc1OFOjaeqKkOnTC9Ci7uDjvTwhSOk\nA2g8WyntUWziZl5zYAmDG4RQGhY3Hw7r7jprRjklrBRlUgns6an91ArVOQ8S\nEyO71hdETj8k2cBMCvYldXF9JfQ+ppWRaUeeKY1ASaGTofINM499wETfCeOo\nF6zSHO/17OTUqOW41G/N73oRe5JGp/D9DP8dulN5t7EiPyKroFb+w0VxCemx\nvMQzz1r9NJHJ29xp3E1cpPG4NFwyc6yRxoFN1YNFrLSnsKFsQEXhyn8cPzqO\namkI\r\n=RatA\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"aa580797c29e4bd0249b883492d0f51cc4b75a25","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1005151","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.1_1637945604265_0.03469928457616467","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.2":{"name":"next-slicezone","version":"0.1.4-alpha.2","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.2","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"67ef62cd2dd89499f2c7338b9ec3ba3d0e540c05","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.2.tgz","fileCount":29,"integrity":"sha512-XK7BGyiUCS5qJkRGWe718jQx5lgMjODQk05Wj45XsjyphXPmCrUD7TBfl00z33lhgaG1wGgJ+3JSjKEd3OTiGw==","signatures":[{"sig":"MEUCIA1wc447zYxQHO+pFbh4Q6vvQYGbOse+Fq+IeVbcnkf5AiEAlJs1ySBD7crWkwnvp0u6rWkIEIfaq8k5KVecwVXSWdM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82868,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhpOgOCRA9TVsSAnZWagAAFDUP/AhqKpSTim8z6VVyEmSS\nSWVcSrrHKV6kaZb/Fh5KGCG9gINKvARq+qFfUa0Jrko1GsHlWsMi/24VaLtS\nA5bNt9Q1M4UynqYohQTDHnojRZxO/xPsjjWq0quHGlM5iO0wiprlA4O0bmw5\nJOzODysQfRG+EfLx9C91vl/2GywXDoFkvEuwURDA5W5BhZ1VWe7b9gdrkusz\nuxlS8LTfriRSp+RNZYH57jLWfzBJS4LNbGJPvooS4831eAEoVSlMYjaJAgZA\ndREQ5kNYEAyFPMaN7MoXgJjB0K2x5EU33sJ71nZo6zTKhcLYZho5TYpWYYBS\nheY5cS+rX258Lv3Jrb41fJ7c3pZhovwXfWYPQ2N3i4OKtJ8TgW461lVuaEwK\nY1M+csh3LCsSjw/QmYxlNltLx/PnHNxL67pkqRoxpo4pW2aHpNi4BERQKRDD\nNK+b8fpMoUfnNGUp/KoUQORIXkBbEdLctSXI2vkmVjrPfebj72qeI6LdKWsF\nRQgiK47zMzHKTPSpyquNwETgYr72DxDp4FZcdCLWWxPNFRLjdvHXG0UlWumK\n13T9He1l4NpgHqhMsOAvp97zQemuJcnBKsFVGVR6eNuOrKO9o6hHhC6ru2pa\nreb6wlkg19bEdN2foKaTkTrBptW+9hvcOJ+W43eJMuwxzxq5Z2f7/vEH+wUc\npA8C\r\n=AXaH\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"ad0b59d7c7b1011c46b3ec7191e25d8ba94e7ca8","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1005151","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.2_1638197262826_0.5134129724619454","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.3":{"name":"next-slicezone","version":"0.1.4-alpha.3","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.3","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"e9c3956c14a9b9a60b41f74eabe7d6dbd8556f0f","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.3.tgz","fileCount":29,"integrity":"sha512-OWBung7jWMU6fjCer7qjzn1I26n6Xlr0VEBAGlXpkrZ76lO6cfieASWbEGItrcGFdp+dQOVrcXcK4W3qnNC7Gw==","signatures":[{"sig":"MEQCIBVQMaTi99Z2eXiejPbnASEFe3br/qSDmNGMXzP7y6aLAiA4V0AyoEJNwYzVGnI6DBszw1r7n/3wj77A/Oj+AM4KlA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82868,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhqMUyCRA9TVsSAnZWagAAUsQP+wRFXc45fTbIe0zbED2Z\n9TZJqjatF+7MA3F0HXnMGgBw91KDbNxjWmNoq6Uk/9bzj9DXW57VyDOBPvl1\nh3KhQYf1zRFlatuM/dBSiw4r0BzDY+LdihAO2w2ZM9iqawN8P8CRjeWDk4R0\n3FyCigMUoJ2pmshS3j58KFkyinr757cnQXGYSkRmrrUGdGWxnLIK63r9TFKK\nTE2CJG1IyKqoA0vBNDTcFXN8HePTQ6WxL3LFjp6K2ZDdMP+2X072MVySo9iI\nHVZqtfqhAKTjkyaETsSg0KXOQlG57Yy+Kh4LXrZVSrq6pkC2h2zdYjHeEf/O\nWpCqdujtz/A3fcyoS1nXnsnq0ADwEAHhyvwU3FlCqybuGWEIuzzM1zATWWnd\n+X16YvIye/7rmdlpLSWvnsntcLGpRupMpi0qA74q3v9rQakeRJMeyEudxydp\nbKWVYz8LSG6Klb5CVQ8mfriCiMmGyOmbFXd8mKNhKnDLh/yUpisKVlLh7ju1\norf7FKqPOSnUMCH24Ni2wOX3riyqTsFTDjTi4YU4txnxTyjmtMYIH+DXnMs/\nKKiGBFW8O+I3RfrE6+ZCq9P/F+PeyoOVPoBYt0aWrLtFrqx3vbzxQyj97Ytn\nqjAFb3nt158jQhdqHaQ23r3x8PsH1R8a9FUqTYp0YazEJKy8D+w4Da9PcYVH\nGzka\r\n=6iUI\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"8e27d378c59a945a662111af15b18af924012869","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1005151","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.3_1638450482399_0.2505285867290661","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.4":{"name":"next-slicezone","version":"0.1.4-alpha.4","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.4","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"e29153a853a1114eef88a617cfba791c9635399f","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.4.tgz","fileCount":29,"integrity":"sha512-CpzC8IjyIC3tPY6FSYEyY8/I4EKxfrH3iQNl7cIbA59g4jbyde+/DvWxEhB6BDHivIFmBIfUlKxrTvjEAIarSg==","signatures":[{"sig":"MEYCIQD0ibwi7XpFsTjJS6lRwt9m1EpEbqsnikIViQ/a+RdutwIhANAb907GHugiKjP8e/XlaizD2xE7STfwtitkSK+D0so+","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82868,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhqPeYCRA9TVsSAnZWagAAOM8P/0pHjEKTiDOxakyB83CD\nwtAf9rXVxWYC+W6QNYHWiZvj9DW34Cb+ql51wEpRIMsGOPqKMXvrxyCOGdRn\nVww8MlDqWY/n+TjjKE50FlmRCtRskAuxPMQSBhEmJF/Xw1p865bSkrS+6wPM\nT8/1OhBcPjmhPh6wAhRhOKnhShbW4168GKxbY8SaMizrUv/vokgp79D93pnz\nQT3IMsd2fBDUQgjfoOKhUSmHqnmzcJEJxtba/mHPSbKdlB28eauM2GUtCr6Q\nKxMKkIELYoYjZjFX9d5/7rxcETbQFa/5tAPoBA1WodShwxsud7ApRVDr7ymH\nRyNhTkyLqtasIncz6zx+KjA3RuH15xiwbUBvLTFg/OgPJ9EpShjCcEGdVavc\nbv3+NA2L9w0IGCbzrkM/ZXqsknF0agHLTpz1Hk5iMM72tAv2mCTrtISiOy4o\nrxzmisCB4o0dPvctrQTQXWydPuHR1gjWJeHZiQsdM9mmp3qUQIBJUbCDnfn6\nvs0G/Maa9LiUmA+yjqPlFvcRB6JNqSiG3r8YEYpHTHTG6JJPXOLnnk6RrGg6\nty57zwARssZKNuINzvF5YaA6H69jgUZnJ4j61ZZdzOD6/bYqJLapbnmj+11x\nedP9BruSA0CGH5/wDfqjxNZUDLi1ycIRpJsAYRaP3ZSCiT3NiXT49LFX4f+z\nJ2oL\r\n=nEj7\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"d095d34843c9246acaae1070798806afa28527d3","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1005151","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.4_1638463384533_0.6940696456457904","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.5":{"name":"next-slicezone","version":"0.1.4-alpha.5","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.5","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"53f2ac2cb66715fa67fa593adb11087d5c4fabb0","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.5.tgz","fileCount":29,"integrity":"sha512-s7udEWLFsUJYhdDrWHJMqA21ye99qKCIFn2hS9KdxIgi5q0+VRBRxGd2uJM+LBtN6roPV6SWiWDHxGr9Lbh/NQ==","signatures":[{"sig":"MEUCIQDdwcHw5sRSTVB/XZkHSu+hNNiHpaX4zBPKCc5Ni3aalAIgX1rY5jKJwnDSlerrak+AxXSrNruPsR7sDhBNh4ExmRQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82868,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhriaSCRA9TVsSAnZWagAAe5EP/24QZascnHpcH9x8mTli\nAZ1xJ/ggz61FsXzOYeNWbPejTqtHeIRa/lqtW/uEkPApr2B9ugcWl8GQKBZF\n7/F5oePryUSmVZ3l+9zm/TK4W9rB1Zxi/MZCbl+NNw2WlC7B8MLeIXHebn8v\nJwn6sosHQxg4hJgmhOOrgYQPcrI9Z8O38usncSjTi8slSpx5wnFrbegsJrSA\nTSkrpO/1musV6wmAv1rbaIxVWFGHa5n8+U2H9mGsLDTqaHkMUErnjGjOqnbv\nEkR6eBHXPPxlt6MHfprTK+offWl7Ec+wvLGie/PQ2zAAh5GFKrqpGHONpshH\nwn6Lfcd4WF+wC/MnBWFGjPUhWdWQJO4wXarRCbIyexJQTFQx9xtZz5WTU85t\nL15DV2F/YO8zXEyfK2qGnpa6bFhRmPvPqKVCu0yEeFK+KG5s29nz2s1Gkk/a\nylKQQuOnstOllNuX0o2U85bLPaDj0LsauPVAytbKXqFFhXT4PgWfRblLCNpw\nKSPOIei4nZkscrg4sIJpEtN2BQ+yMKKXK7mhA8dRaOiM1VWH6gVDDk2LL6LQ\nOtOCgcOrs/wbNyZ2gx1nz7GtCOtRHysFfMzmRqje8N9iKQAQozRx5uVFxfhd\no+KumGLUy6pS5qTpShvWaJxvueb/GhxGomF0nuK+TYcbvs044RiQHCATAq8f\npKQQ\r\n=OuNI\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"301627d7e7302666ac95b4dba947b6c7003506f0","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.5_1638803090185_0.8532296880750376","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.8":{"name":"next-slicezone","version":"0.1.4-alpha.8","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.8","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"adf38938b1e3a2c82c1b662cff07ec54bc9bf1c1","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.8.tgz","fileCount":30,"integrity":"sha512-Gx0pGKDWpf06uScUky9WsJn5Xg7SMWjcw1PAs9OqN+9iQRPeg8SYyO6uL8UHuJ/Ysy0FVVsVwCkOMKthCGsZdA==","signatures":[{"sig":"MEUCIQCtuUi+VjGJPbmixx3CDhJS8FHrYdNczIeYfW5kh6MrowIgJSoJ3SdXvf1Uaf1/xblsDxYIzDEW0pmkPpijEZH6EII=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhtydzCRA9TVsSAnZWagAA3fQQAIa6Hp3+/geNYPeBAeQ3\neJ1Vl4gMCFANwyhni3d9kE//LQrpv8uSu/jFm5qMuqzk61wAK8Ab/cFgrH9J\nJRY4qzbX7kk1HO+WvIKPYYEedmGOfyqnUXUolaoocutUOObXhUNZhNJLKvUi\nmkPPyuFd3dH/9mD2jC1nMbXjJBO5Le9dDf1msf+qK4GD4l7k5fsW276lCVwI\no4jMKdiuJE7ucJgLDFLkiZ4VN2BiPPtaDKgezdnhKuL3QQyhFWxIx9JONZbo\nNEZwvUcHPqTfB3xFp1PqIh01NpfmCYL7d3aEuHlkNPaG3ZksvsjGcjvCha2g\nY7O/3kYYRqR7fUSsQHgLsWqYpARUJz6X7HybIywi+4fstUV2KFydZGiRDVl5\nm+0tfap9A0KE949UzY0Ht8bAVc3rS8mQVnGB/f6JoG2FC4jRCQ6M5GzBW5cG\nCuVVnjgF9ARW8yOwflzbdRsvuzodgmPujpyNLcq1qf3lDoWcuMFeQhOHdRF7\nVQ16FGb/MA0kufrycT/dhoxh+hZWr9+f3zapQsezoSreCLuxhZQTo/KSVhgg\n77KpSjW9gxu1fnYAvRKrvWRGYpdFLD3NH3AME2aHnp4ND7145/mdr26j9KND\nxrWdL37ysEcGcbhGuyw1ESGO53rBVCPqPbjbEgO4gtjOiShQCIKQ/QNisSv9\nIMfg\r\n=9o94\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"7652fcdcd9d03006b8a3730b9d01958e8650f85e","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.8_1639393139066_0.6243313764529628","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.9":{"name":"next-slicezone","version":"0.1.4-alpha.9","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.9","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"384d99e61581735ec4b554ad1ac773c4b4963bb3","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.9.tgz","fileCount":30,"integrity":"sha512-t265P+tgNO94K7Mr76gDC1gAipJvJiGRXdlwA2KCPL0L1N3LCB9oC4PlrdK/9bBE7lYay6d0oW0/VcZjUU+oFg==","signatures":[{"sig":"MEUCIQCi4Wu/D3U5QIMjNu3SwEn0f83NtjA3JJ2Oq5IPZH/TywIgCuQv/5RDaFYoQc1r/Jnd1GXluxxvomFzcHKpJbD9fuM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJht1FeCRA9TVsSAnZWagAAjtMP/A7Y71m6meDiB4HFdT/v\nze2ClJjiZnxT5JUfWh4poe7AWm2BKdoCRNvPIpec7Ow29ZDi+K5ZegzQYiMc\nsIcMS/x6KlgYavssewhmA/aLeXkuYnKjga2bsEhZee6pdnIxnt3U7+YKjEwJ\neIq71K+hZ7qhm0o9yFvrTDVWMFS+RI32NxNhrfxGCsKTrQrZ4GhT0ytjifzR\nqzOCA81FTqR9b88Ws2g0vdMu+5UTu7rK+QmPUDJ9c8G9wlLXRMg6vZidN6kT\nxjxV0WHCc7bTcpXBoXUW2DltvTqhAUfe4mJSxl7xRKz/V+1lQAmJaB4fs6Tq\nXMFKRtZXPtxZm6lMwEa/JFT3GKkpM0Gafc8wwSu3c96tEgsX1uc9FYGiAI4s\nF2NlCpjXb4f7wrvo0RASDCa7Fu1eP4o1HhrvXuGOjI0xfccVU067r5Bp2bCG\nFJZYTBEWQtmEJZQEVhJKd+HDandKMLt32fh9e4VBCOsxOakpEX7HhyBgMzHE\nxYvNULI9v7T9w0f54x20AI9BjB1O2vXpvNncN732ZhxCW8fzkFrM8oOjczVW\n9Vcny9c0QVe54a7OMwfdr5Qb8JtEuhcVZxeibaZ5c3DtOdrJDGFpoK19Dbim\nnNMybB+qBvXz2rJ9aQdw8IbOZcZ8xMAs21SxxmWT2LsIrZ0O8G3yrdLvZCN2\ntwYo\r\n=PFNb\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"e00dc089e0439df31211168c1c73124156f715bc","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.9_1639403870558_0.8660694467676677","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.10":{"name":"next-slicezone","version":"0.1.4-alpha.10","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.10","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"8303bfd0c8b6001ea12b7c46e4c1930ba367621e","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.10.tgz","fileCount":30,"integrity":"sha512-mSgPl2ezwa46zTBqyIgGD1UUyKPEb1JwOKatozps4pJaO/zmcmq6YEJ7WCdvmkx6e0wzR4ve1VUihNWLoqOLSA==","signatures":[{"sig":"MEUCIGNdJSauIjKc0K5+JEOgeGp2G+H2y23KrPypBPQogVy9AiEAuld6DVAXUZ9zFKVopsisMg4E3qQWc7uNsxejZ2GE8TE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJht2DPCRA9TVsSAnZWagAAHTUP/iaPTo8He2GgiRGho70h\n43DVHa+Z3pYwxj7vQ/FuvtcwymlrUKUB3bYCr16dN/w1s9mQdeeL6qL1MDA5\n/h+0VrNHJbdA8ImWYdbLHlBsOmkzDb036L4lcepTuwHaItrj1449jlDRJcZV\ncuNHWorMH89SyoyDjq/Ig3R1WTbUpAwjICxK1/Ub7q+NiHJViAVPGol2WBYn\nwNUPxm8Bb4wAOvw39Eh8qYAcQsdwhAad0/Bu8SnqFCC1luYVZPD62DOKojld\nKiDEGNM5omfcDIT4ZEIJyG3DbexxyAlHI7grktXct6sArq2xHD0jzN2vK8Ii\ne5WBb7uiBJstSPEZk3r77ii+1+BukdO4KSJxJ/8xIrJASUxaiTVnyxEnnL19\nCbEMaYXMtK0XRg8p9uTr9rjY3inVOAXr8Xjk4qRikLJrT3g7r3pU4ZClcXLU\njulosUbRM4+r5XeW6531puygbIL4RskvcEHIj7T3/LxtYJSHiNqyAVdUXzVO\ntd3QY4K8PpvTTXoV1MJQRS7zq+QgZDd7zCBL3KqLosfMylUqjqq6Ch98SCm2\nobJpW6Ip+tESnNeqi+LB1VBUG5Nr2+IgdQV07voxB0KKQwyBDUs9UUMWTO+1\nTKuG7ylaINPL8wzKD6FPvjwDIj8gSSu8/a5i/3HzgaiDgr+o9HaJzUgp4gbT\nLvZf\r\n=fsfp\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"8109760f95da8563d79dcd1dbbee755ee0f75a6a","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.10_1639407823753_0.08943854858430633","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.11":{"name":"next-slicezone","version":"0.1.4-alpha.11","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.11","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"59a8f1962ca3aa8bd3efbce3e576881531a0b2d7","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.11.tgz","fileCount":30,"integrity":"sha512-GjYyf9PK4G/YEqZf+s3wPE0L+nB4KPwMM6WYKZpzLqvar2ir2kd/fl2mhuPv67pUTDY6Hss3Kmns4LJ+UJmOgQ==","signatures":[{"sig":"MEUCIQChyEgo28fFtSO8nh82CmGskSj6bL+ShJVPK6UiOQM71gIgZSQPlBaNDMfCEqaYyIOdInCFqKj+eEBOdHUFLFWxYEQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJht2nuCRA9TVsSAnZWagAA9DIP/1mxiqb5bitZn9Xskhzo\n8YQkV4qZtT63l2Gn4ud6nipZKm+snDL5ozblCR38oD4mhgFUKIHX6t53v7nl\njtod+M1rp4rDylVAEJihxQvguiPRKy+LchWA5R97z7967Js8XktwGR1sbDwT\neVLojLR04vhrSXV8a/MnK1S2AUuH4BUQ/kGZ9IxfTi9MoWu++hk/Ld+p8xp+\nPxi3h+u0Y+kJ8MD5Q/yYWU0/zAklC7XpFhN4Ue2cPvSxEvPuGQcCKpN/L5JG\n7cKyujEoUefjv2p1ZlhyIgEAMw/8ABR5Hk0ugJbdorVzoa5uh+ooanXuRZzy\n3xuN8k/VCrPldre6LVuJePrTtnbQ0eRN/wSB1VuXyxylFNJfXvwB3Q11UhxP\nUiB1GkccQcpRH1fxZD4I8p/gJTUpEJTBYd427UJvDCeWZdBR8otRNrdKBLqa\n4P2m1IwHkZqUcpKgsMFKz/wv+O68crj7yQ12HK9nq/4PesFXgsG7nTrwpxoq\nHfJlu4aaoXI6gJAAy+3oXcEXvCN0p3AI8BVnEfPoTBktwLqbV7mOLvBXJEsc\nNolyDs6kfnZV0ryTMKlZpNNXCM4uzA+wNgTPqaB0TRdEr+vN2jY7YK6ziWpO\nXBY5Jwda3dFgZaRx45Upmst5CryKjJuREAxm08sdFjljvLYYuQJrpEWByLhH\nRdJM\r\n=opb5\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"1712d1d0bce294c80c891bd5d20f758bbf70b047","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.11_1639410158257_0.49117279545107273","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.12":{"name":"next-slicezone","version":"0.1.4-alpha.12","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.12","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"afe5d517322a81d7493ca38d680d67ac2ba4c793","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.12.tgz","fileCount":30,"integrity":"sha512-E+xcElyAdBC2wvRN8YHRlWDQD2Tv3/GvF8+I0AY7bA+maEgrHlU2J3HeHkl5zVEl0iT7y0gPYrbhQ0oolABwPw==","signatures":[{"sig":"MEQCIHbkKgwC7+qlW/yKXloLuxBHAggNT3W/2vERRM7DtSgSAiBDpYgSPwCxqJPYwzqz7+V3GA8YG/IQX69mqXo2P3431Q==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhuGBaCRA9TVsSAnZWagAAA4oP/3gCn99fS7O1MlxoXqEo\ntUzH9RxMVg7SOCide9d9eMjvWc5nMthcbTAkORY/5fzl/k3c+3odbOWTqck5\nsr8BQaj3G/CSZIMy/6AE7cFYvykyifih1aWzqBlxJEpYxuxq/wmeWi0uo5r6\nFArtfHLQiYnjZYb+nkuTxUJWQQcW+/gFomoCSwzNjj85W0aBh+I3flcwmrkY\nnhLBEJ5VZGsjUzt/XQPyJ0HHf3WVeHkU/bsCSK1EU19ldp2XmalZvxVIz+fO\nfWtA0EZhmrJ0fCN6BXyWPYYOK0ciy5trCZTfYHSKpc2ndSg053CdiwF3ASYo\nyUfPyX7KaNdOaWx/Qp56z72QewpinHXGzr1wflBhtoupWAB9Z4hDFdnnu7OM\nR5OoOYuUI0QYztIAHXR0opxbddKprh7sN2+BNva0Y0bN2zb7lJJh2uiPm7Lc\n4O2TACQscbuoNDyJACCjCo+j3peM7/6tD8NkmlBbcjtDJy+dOBg+0+uwPS0P\n9gYLf+Vw5E+uLh/XD9kFCUBJubNQf4TWDaIcEvONzcPRVXIzXGdGEtQjQw+Z\n5m4rkMjxw1vpWZ4vN53hLjdAHg79mWycNitRDpqX1ktFai5ovDD34tlQpqQP\n2CW50istgJOPppGypwiZO+hVHh19WXGKxCUrnBM5VmsNOuCK909FWSsAnrNJ\nb+y8\r\n=lWnq\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"4db4aef1d799725b7164831aef6a25546ca1a376","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.12_1639473241933_0.8219345160596527","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.13":{"name":"next-slicezone","version":"0.1.4-alpha.13","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.13","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"1657dd9777e3388f290ce8c3542e3197f7fb355e","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.13.tgz","fileCount":30,"integrity":"sha512-mgDkSBV9Tv8/FdNfEBOi+haZaQXQN0B/XuEPzWFXNaGn33eplt76bLsXhbC2GeZGBnTsA5mLKZWeWkUiZtMFoQ==","signatures":[{"sig":"MEUCIEqLP902+/sCk9WXNX/pviLo6QeTlR8GpqHRFPZSVHsdAiEA2n7oAd5IeA4ekz54ePq9xysaggSzMmZmaRja2qopJ7I=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhuLtqCRA9TVsSAnZWagAA9usP/2CW1fWPNEkEDLxEZxrR\nuYQHNqbzzkiHEUyvUUHRop3cfJbRgtZqGqrFLUKCz7BWRPfZHiRxbvfmkEKL\nm44a0Fo0ZEACdErecOMWO2t/YYQyDyRv/dTkEcKalxajIJRhddJflvtGbdzS\nm7O8cdDkl65b1/EhO3oTEqanLk64gLqDGXDyYemRaFm9zmHu9VOdatw19rm3\nJI9Nofb4SpHn0ivHaW6FwvXYIPcFHpj1q8im94reMbW23/qUq689zJXmF+zO\nqApDECpIkTFjgpydTA5kfXb5BbmOQPmYcYaXhmnotQmMzRUmQaIpX7Wn5erD\naZLZorKUEzPp6JNIbO3693V9QjoEvShgKcXKzWM1UdVHIQbsFmZ6ZmAdDO+a\nZgf1sF2q+QPhRhlrhLUUQMuQY0HdSDmxiK8PxPSqlYmmT9rM/qCp+rIJsaPn\nI7oLxMja+TiJKHrYW+FNcMp+p84WoqYXABbDoBv4AAEGnTHZzEFuwJ1bQNL2\nBdiBw8QUP/LDYE3t69TGAFuAxRHu+orVuJT50Q0ulEO3Alnb+cZOWTPLKNon\nbwnJgB9EdmBZkUICakWzleiI2tzW/D219/xfhFnOf9qbwEDQOm9OM4wtZaxL\nI+neW+D3KUKo83RAoSO8LSySTu+78ERH583xoEaigVCK3w/ZgLt3MQdbdCDz\nyRx0\r\n=6ELc\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"8f5d77e7945fade47caea0b355b813b14f224e93","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.13_1639496554616_0.15516645922938443","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.14":{"name":"next-slicezone","version":"0.1.4-alpha.14","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.14","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"da8d23699c9870ca8a23f0f00502fb0d5e0c15cf","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.14.tgz","fileCount":30,"integrity":"sha512-tpxZkHXpLvuF0542BnHvhh9VokW8kOtZiTHjkUcImZmbigzxQolAp/l+Qvhis+TkWKLkzpMWrrpbtQ27WER0GQ==","signatures":[{"sig":"MEUCIDXqtt0ezM8yksE+Dj3jQLrdqEtdwpqp+OXuLdUqayBAAiEAiNYkncf0QPK/YShc5VI6T5cmKosrF3Ypxf90/kj1aE0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhucDyCRA9TVsSAnZWagAARqAP/R90RzgZD+wuiH2zDoau\nGQu8QQcdg2DggzJTZPtvJIDk5N2LGRsRX/pNQ+8CLAWgtTtToM4OxZRVLCXB\nsFed5ouSHuAssIxXc3IbgbSB6A9xYJwQOsSWmTjubSck7wTPHfE0Xl7kZNOe\nh9i8UVF4ZYWEBXGlKog7KCPzplkGw+V28Qdbq3B3MovrExS5tqlQhf3XLNiH\nrcrcUMG4ni6pMZ2Mia3LSUFZsBKpyiR7H/ZJ+/XC1+xTpnbg62mhg0SNgd7t\n1cy314MPZ9pR1e4mz0CpF9B3Il2tGfwLpRXmA4EQTTsefyO1QOkELuY9OEKB\nSAttrGvmm+qDyDcPGSBpmRFrjmVhUWnMmWR0Uyv+EgrLlLvXcPRgyfuiZMX9\nXdIz/ylAtNzuVt5k/TAjWAMztUCgDgPx0ISe8koE4IPq7HB1IfDdYB8GlLVN\n/KHitP7aMd58yok2uPkfK2NaMnH+UrMzMTZTClqa7iLWO1Y/LvHZqK02Y+h/\neSU9FIh7wKpzGzIsDO9Nxr9c3obmC63NCQUu9gKx1o4bY0CVP/Cr2VGicBzq\nbdWZAWnhZ1hISy0q2CghkF4z8BdxryT0gEPLo06be+tJ/7vt6i2f/ICXL4qx\n1ha5JdfHxNwPzqUeCiJOXGULSZDFrDlW+Ihkjv+OGCv8AcpUuZTOnt+MTH46\nUSKu\r\n=sFOI\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"4f0448100b3190837ebe8958784ea7981180a1d4","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.14_1639563506437_0.08199936477466441","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.15":{"name":"next-slicezone","version":"0.1.4-alpha.15","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.15","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"30be9149cfdfc3b87e3744e58682f53e1b73f7e9","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.15.tgz","fileCount":30,"integrity":"sha512-ZkYA+m/NQdiiiT8IupaZj8PKJIGa6/YTuquB/sSicievXDhFQARHkzGjn8yryRgCzDNuprwzgTZV87ucmDdPUw==","signatures":[{"sig":"MEUCIQCiu6YPDsFyX9gtkd6l39kRpqivsTdG6Z1bn8BpWoXTBgIgH4VehUfZH1+Y6y+SxRQyekap+KYv4Xi3+ettzpnJWaQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhu0LhCRA9TVsSAnZWagAAuBgP/ApWm8RLSMXuWeqxygVU\ns4sukI5xmz1KT45Ox8HxEuQvoKOWLnVwQhEd04NWNM+A5zA4xyvBrJlc2Ojn\nQBRgFs52PlTvapy1YoN2cmxfVncpFFMbGjrujntJmfeZqtMpyQVnQTlv9XWN\nvk4XARwZnNQse11srHtCepSugoZGalZijoCwdo5el2ESE8328oWac5FGXjh8\nj4nCPCY+Grl9lso29Edsl/DY5dCctuMCUnSPb+HZ+3oSYexMnnqDpUJi/hmC\n1RZELmFXsD/k7oBaVEl5n9BViJqPr2jCMshuX+HWVPwSdSRUcOMpBwaYlpn9\nGZSB0PRfWho6dC94av7HhohWgT/6rBRcqXyJdB1iG/DipjRf4bSmxAUN46PI\n/16ns2u49lGUl+0E1FoNPDzDCdQ+8L8xYNfB6Oe0dlfWM+uNIUZKwVims2e4\nw3KuQC3KDBvkXnCujAHuHbiMK28v9/xODtLzkn5ru9xeiHZEKr5PIUio/4us\nuOQeCu2tH7+oacvAe5IsGyNJCTgvxRUbm955adX1J4v4aKJ+MXuN5IiVyjNC\nYzHCzWNGNv2xte0Ot9mfdPkuqS+zhwdQkpIpaBAxIKtHbLaVHUrw8iV2xQ04\nc0txbq8nMwFORkMBM0AcUJtBC/oL5NJO3t74/1mgpXZZqg7yaR4/0zd/v+5q\nYTI/\r\n=MksO\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"efeac16ea85edf4de9b11b162bc8062bbd550eed","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.15_1639662305479_0.6707300507464315","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.16":{"name":"next-slicezone","version":"0.1.4-alpha.16","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.16","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"8cede06f13dd9f1ce4872ca656f095c646e56c89","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.16.tgz","fileCount":30,"integrity":"sha512-l/VuzFTxrZpvJuAYoYemRkU3TbfneujDqsaJYI54RNo4wbEqPvNGGAUXEP+smCm4Z2LdLTmOKrTCyuPdwqBc7Q==","signatures":[{"sig":"MEYCIQCA7X/vn9KsvuQMfj93MmCsVozhN62rYREUFXGwMR3XYgIhALN/pWazTi/JRBRX+k5WhTovIyqYElK+dgAm4ZdNDhag","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhu0RKCRA9TVsSAnZWagAAfrwP/iEsVoUv1HHaqU/JthRF\nq74BPp4sXQJg234AQuSpy3H8leQWvCB1ywIIlrk9oToO8kLSBsXGiZ1hs/C0\nrSXx+uEqkJ1kyUAH9ZJq14vK38bPN63ba4gDDLL9+Yw8UI7mrkP/xuvPegG/\nC1j/60BXn54F+P0v6OxpFv/05UaTh+fpfEEGf5Ghyggv1SYxzvegs8U2Cvgu\n8l/VM/9AWC0XwigNP46ddO9/eVdYwoLkU3SXlx3WTLzJKk3s3UKuQiuhO+O6\n4OtJpBfqjS5mp34013WckDIdPb8g164G2vxCqnUufzlln1swHTnfv5XBpDvR\na7pt6SmykrJO5C902QNB4x0h9zF6chIlZAcZ/ZEL7N/i19J5etxC0Ix9+rwM\nHmoiEFcY8ghR+UmYVbha5+gR8b4QPofycPJREOMCIFUwR8jbTYZ7JibxHwoY\nW3fW6KDmpv28uI62SyafehqUUJW/6b2hOzo6YqA8dECsUCY19daY7q5PN3UX\nhQU09YxuyQTmIPaXbcsYJZ2cDJ1wMOKzxdprc3vB/X0zY44TIzTIcabetQPV\npB0hl3Xcj7i99a757oC3lK2OTWHGepbadHJ2SIZXG1U+TvMi/K+sZaWcxBKm\nmG9Xh6p3hGP99waND6Wf45llZClJ7+wvfT+IlsPSPTq6d/+alkPKvEtEpVWQ\nENlg\r\n=LUBF\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"993f03aed40d0738174a30320dc78d3773de2f42","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.16_1639662666247_0.33410658305926844","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.17":{"name":"next-slicezone","version":"0.1.4-alpha.17","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.17","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"67f487cc26baff8ea0c292248093bc3d40843f39","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.17.tgz","fileCount":30,"integrity":"sha512-cVAcoVp02/OuZLq+EOpuKwgMVIZjcfGPGEZxymcrcy0anb0vxAF0NMC5O/7Qpg0mHcTBHpyH3dZPXBfNezWHaw==","signatures":[{"sig":"MEQCIEZ8kN58MuIF0U0pLv3niL9n5f3dIRL+Z8tjmrOZR4GjAiBCxlJ9QUr4MlbUrfQTCI0KB+V7V/XFrQpADdqwFmOTJw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhvFETCRA9TVsSAnZWagAAuMAP/jEFqJtbdLUJL3XAsDmt\nc2PLxvDRWbb8J6/QvvHEP2epGMTlDoGRjWEv9ui4pBlBy39hr4Q+E59ADhrD\nnMdj+7g3jzBZWQuzvAM9qdwcSA7VctyRd/vyhjX/Ah9jng8XwjGv6puhNbye\nFTtUBli1I3xPEYwR3wgyvMKQQsFOdyPd+t/lwAR0om3N4nPWLrJgJos8oAuW\nccSwGAsk1s/t3iT67wrIhxPwBCqIB7vn9axzEvbvHaqM2bw+HYnM7Obzux6C\nhlrADA/VAW6j4Zl2NSFycicyZrDS/f/AvfdHrffofA0XFidy5esHEavmjaOv\njxkMif6LbtsUryJIFS9aEbPsIBaYx8Pzpe2gTzCtB9wyZkgEBuE2u767L52s\nrTWMo5jogaEGh7GTuqc4LEEK9JMCJX/sEV58FloWGPoTKZBRE7eCfZQIoruY\nVDeZ/AQqEaSbKaAzqVM8xZD7vVn6DRjd+729mkAj5AY7IXfzx8zTW9EZz85/\nYBd6bYE+/masfq5UuuwbupzAB8Mvg+H/ObGWvw04hkfOcZW9XQAqjnTZewyu\nJdUFRkHfQo5cubxozvT9SyoDdOQugXlHDxAcK53fETc0zDHoWamdIZkXrgnZ\nJ/6kYu8KLNZ7y7cXz2/0T1JV+hmMNDAFFVmr9DUsejE5FFJnxU/ZbJyztvCk\nENwe\r\n=GhvZ\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"446c25963ed50e7e3b6a8681236874ed8d3a9ebd","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.17_1639731475066_0.5799926360560645","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.18":{"name":"next-slicezone","version":"0.1.4-alpha.18","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.18","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"9583f55fcac79c89ab33b9f25025efbc468c6af1","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.18.tgz","fileCount":30,"integrity":"sha512-DXYDmyK3pc37ZmAt8QT9sDL9yk6oB6Yfqoca4cVWaDg/8CuzniSJAv82nueESYitLcfljyF8tuzgM6yi2V0krQ==","signatures":[{"sig":"MEUCIQCNR0f5Q4/ONvBb0TaxJ4qqsd19Hh0FRvrjyNmfCjGfCgIgHBtBHW5x4knAR6uAdszlCqrRiLzcdTWyN0oLo3EdLz8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhwKMXCRA9TVsSAnZWagAAn+IP/2ZlWh4a2+LVexbP2UDu\nF497WhTSF7phcwu7Mjx6BdteXVYyA6UQnu80htWOHUgNd4tKPFvTu3Xb4o+X\nbboJdoTzKPg/IcW/3sVIxtZ+lvrjq0BVcqYksdUv4nnofc/7WoaToVKbZ7Sp\nN3XBlCQZpBlCryM+JEF4n/qMjTiqViHHfSnxwvvce6tpIBt8d8LkdvR0N9q1\nQPST2Dis9YvSlWhhkaSCqXNfRRnEkOhuS7+T1loON/WtD4Wmd9mBHjAA4BMg\nWrxnVqfeW6vF2HFQLiQGsM+u67AOlhpj/XCPqJUBa9EJ7uYFjBLhYyHTFhzf\n6BXd24Q5Uh18uAmiKYwYhIFaeCWwoeJBtJKJ80qHzbbhhzRbDgCYkSQEjRq/\n5NUptARe+jSzsWVpkCQHs/MEqMLHrL1D5GzKD5enySicDFisT7juTkbJC+e7\nZAMvExVczNCumd8iCEDWN2c4GUWemTmwC4qoLD2y9fkQLizf6HA2YJyDUWaI\nnbmn6ZF6O0lf07Bb00KBy5T66vCIcMaWfwJNp01VJLCPD6qquYixOhCLmhxG\nLTLnlvu5V8/ghEp93IQVxcB36WVULp2Wy2aqjExnW/VzYkjsVdKM4QarMGrc\nfM1Mz+zeBdV5EjG0T1MzwgSgn2G5Fzd2PqUMcKe0LRMNHD9IyT2968XSwdHU\nSP9C\r\n=0KVY\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"bdb5c497f8761730b48d884827936cb1a62b23f9","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.18_1640014615450_0.9860848099288149","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.19":{"name":"next-slicezone","version":"0.1.4-alpha.19","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.19","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"5ff7d18f5842eca7eeb4d0afa53209240570e488","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.19.tgz","fileCount":30,"integrity":"sha512-dHYaO7rGTwhqpCf0u4yulqknZiKXxWWLdpVS/E2RyCiwEWgN5CKA6Tup6rXwmCKy+JXuKbsBP/qSiC+jJmT/BQ==","signatures":[{"sig":"MEUCIQCKbLVPBxLyz0cTscTrIUpKIjTIsoW7BWULuTrbMnZ/lgIgW/EYGVkjfGl1P8MMOjd7ZkcyhE2VGkp5Eknsz5itk9k=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhwcbXCRA9TVsSAnZWagAAGUwP/1XTFKetr2j4jXFdeNKe\nBbo/w3pPlX+1F54bBnVP+TppVQmim6x7f1MDSUB9S7K+/n/vfAIpSPpzH+M2\nDvLX9zVHZ9cizs2wCwNdj9wRl7Cb9VbEOpLnafi+MojvfhmOlNP7m4E0jO7a\ncDfMvVzumoLmXFc72LgG0UgAPjeR1qgiqcxuHtIBGEhNXvmBgKVZTue9XJ4v\nH4bEU4W5rqVG3u9Bl3A5V9C2CCSgAvKRw/PyQu416MkIooH79EBqo5+/cl7k\nRZSejeY4t+5uMm9GkXd2mv8Ze9UsHeUZJGNRvOXztgph7vpyehEHeb4cwA4o\nmya8DYJjND+R36eXSHxxwuRkETzAMLwyoUwmfa4K48gb2VEDECTtZ1nTwApt\naK+dDuOQSZBE1KkA+W15H8E+vqtPzmrdHP/vmqwG26gMdiNExr7HFWeA68lF\n9jSInB9fNPziWipqxoOyDjl494TdjU+2mdyaee90Coh0XhlaBrxIv2l5t5cK\nyoCWnGtafMChV4S4In0JhWKgqrdr05xpCWTh6UKy1IFkkH7yuufzuHqLykd0\nbu7dCLFQxT/eoyy2iVZm2hPHtJ8nHQJ2WEz1XzkNbXvvFTwAXKNbJTzNR2Z1\nxKDPa25tSqo59rvy9NezK+uFXdJn+UR7tt1gaj9+/Efb7d9CWeYx1FoLw43e\nV5kG\r\n=jOzR\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"1f8a026d2c4b78623a5023fc0634094cb5a723ce","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.19_1640089303053_0.6513827397472107","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.20":{"name":"next-slicezone","version":"0.1.4-alpha.20","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.20","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"076a85c61a75833e0b81f66fbcd9afe04e946cfd","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.20.tgz","fileCount":30,"integrity":"sha512-EbFT6sLFAXblBUg8nm7sMh4RUznkDHcWcTjDwMV9s84dHE8BCwthfkfyt2sw7YDbN7wh6G6niGX543LyyOAcTg==","signatures":[{"sig":"MEQCIAFqdCp/T8gDCte/6uHN7taINJSxUKiofyItthPW5RKnAiBEt5TjrQFITVwsflO7unYIRi7BX82mpEewy4W0UK+AJg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhwwHECRA9TVsSAnZWagAAUQcP/RfAhO87fpt76WK5YeQE\n3tJRtNC7ODdIySbEvalJxkuSgK5jZOWnyOU1Qw5x3lFZfUCJ+vd0pPn1fRnY\nJiA+0nRBm98Zk19+Az6sYkBOd1IbXDmg8E24tyj3HXb1DG7dQdC4qncYrMgn\nnA9DeRgagtuR39LHniPi+hCYdnVf71wrAMebqofWPx22hrKopLftaBLnbcwh\n4/padeM/5CsDGSSoYYwWhbn6TpDQmwXm1b5u5urg6QnumKRln3BfhAgutjkt\napwcy9YWBKWoNuwvI56CLJypLDxZbEj2RNlXptiBhTGC4cUnzkmCL4IIGCDS\nG00sStj86+eOJViShql2oQ5mcXwZceUAIXnjqnmUSafV+GAZzSpdVwM235ZC\nzEn8Y/nhJQnVzeWNV0ZdHYhobNSZio9XfChOsNUuoWbmpRqLdhFn9hUzdMdK\n/+8fFnf9nwUIQgICB26FeHEKGL9Cn8xpsjsPFCPYVT6wP0e4wbQhITnFIY+1\nZdTQ4eF/n77wF87RJ9xNCFDrilB2bvdPz9XhdqrpP6nvEiV7vY/nguHnYmTv\noKsNjGOxmutVUjLiYwJ87guKnlWHCwZyPYmtPnX2yFqk5r+O5nCBFFrxRZDI\nywIGlHQFq74KZGx7laGePg4Tihw8N9AsfKvSm0bqpqN/mDDUiQXBN8MJCoCK\nt/Ik\r\n=eMrT\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"33e61636a5e78e269aa89a67909c8eb49f5cbf23","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.20_1640169924246_0.6242588746880329","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.21":{"name":"next-slicezone","version":"0.1.4-alpha.21","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.21","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"46590fc6cea1c1c3ce4281214a26ae1db483249a","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.21.tgz","fileCount":30,"integrity":"sha512-cXVhAmdSe3v3h/C8K0PyBOvzqPSrvelJ+WDAriWCJFd2cyOTh49KiPgXtXj5zjDHyWXdt9Dz9GoAuKOtcmkwbg==","signatures":[{"sig":"MEYCIQCYl3ob5XZTg1whG+NO+y02RvPGMGCwRsSm5+lnHnbdBAIhAM/IrVTPbxiAdt9znrgETRWOK1lnJ7Es8uhZOQhngyaH","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhwyHNCRA9TVsSAnZWagAAb/YP/jp2pIdVYzWuucZZdMKJ\nT4nIUzs4aaYDxMnGmr3JbBwNamyWjSK6TRUTDggZJ4TK4ZxfJkNv28JmOg4W\n/R73E16HDHtVXKyyAAs0ccOm8aE56WlvnDCL+5xtqCTb1+Gm0kTdWmzj0mGm\n/UDCUWnzBNu66NY//hjAWCRw3gtaArPsrVw6oM7v+MjhpdVzFzESFUoVdQOq\n3LukSlJf0wFm4PbwzxZApLTGbt3zh/2lDE0OXY6q7N0tYBu5ZPCWYJ/mX/fN\nHymh4Cg/aIpAnQa/NlFOD6/sl6I+dUBJsNNaaC2N6B3MkQ9XVjLE/4GBq3ea\nr7oiXrbfhKxfWqJ2ydiQwlXzM1N+nwFSbNU1iZ2rClDSSn/T4UiZ0jCfS/qz\nyMvd7i0CCB5E+qFkW4y1ueywy9GiDnwROiorLdwQXMkw5yriMH7xG4ZtFs2t\na4ACCJA1d4AI60Vos7TcI7SWsqEwRvpdf3OL3jA21opVTr7SIOXplJRa2POX\nkjYN1CEYT47dWxdorIFdMTY10is7nIPnbFbyUP2TgzMiZv3TNqwaR/sgTP9Q\ne+dPL5viGXBIXxiufJJANVZcnz0MrFeB34yqW+ZY+ByMYU6+L4sax71HkgZ+\niy1tbdq4eSBqAtrsUus9WwVDkx3Gv29L+BVG6+pizhVxnG1Wrdpc9/ry84T8\nUJ7N\r\n=1eR1\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"974272d145b3a13ca436fa5e6e57f28228c83144","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.21_1640178125464_0.6795532276660932","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.22":{"name":"next-slicezone","version":"0.1.4-alpha.22","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.22","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"176baf2862ac3aa61ad222ae1f7724b76eb3db4a","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.22.tgz","fileCount":30,"integrity":"sha512-NFCAIeylD4/qgOhRK/CP8am1A8L/KXRuKAoAuZKUbqEXCYrEAUFCK6h6IhU87cCnQUPCQN1T6oeS97YmcmpV8w==","signatures":[{"sig":"MEQCID0UG0BLeXUhWoV6ExComPpHYns+tiiRIPc+SHGzSjoRAiB4YHlYElvjsLqFEIrm9m1I0n/LmPTMwMewcRVoqrd6gQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhxKc3CRA9TVsSAnZWagAAPUcP/jkdKIWMgmsfxeSa0yTb\n0QIfxnS9KXqQ9CVJoqcWS/AdSegr4YreEa/ldD565itUWXqtOMtFtmgpPovj\nfT1ZAqrhC2XMvBBs7z8PVURb9G8Sojj2vqa0oYzG6n/OOrtst2B0dTJ3uEUa\nr2p+YXHfTd1QEEVeeqPJWPt1H0Mg073uI68IDsp6VZuAo+luxKhhSpP5HODb\nAxK1Jo6FnTCN5XykQlFevjXxBN+pR51iJ2l1nN97l/vnaK9IBoyLz26LCYqc\n+OBI5ozq4KlUeYlKZnTwkFWPR6JMMf5rjQMzxPQV4Rl8OAuNtHliZxdPhHRm\n6ef54xqwENQa8QkH71YeveWzg2Kalb/xuRQHFwbKxCZQaxXbqudyw21e5NhA\n5JZaR3vSDLnZ8sEjTSU+9VxNbZUkyoOhZ8zWkZHk725LIYR50vU4miZFB7xc\n9xB0SEqqEbPeslzOA410QTjNE75qQ6Z+lap6/IKtWjcP/eMLI7QljhHAIKXJ\nNgwmxQ3pF8NWxUxq+JbtODw+j36Bsp/GcCR5xYlipQYmih528fOsl1SauOMv\n3ckI8EeLsvILN7g7eoLJ+4gE6EvFFPosks3v2dj1jesbCCl1iWCvKQ0ibkYC\n9z+K9zCxkHSvHvjGDJeCFDT6Uq4PjaRQTETrg0GFCGPzgnen9idbdnh353d7\ngl6G\r\n=BhQ2\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"31aa37f4aa41a661cde38781f3d5027e54d01cda","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.22_1640277815350_0.35940989050229954","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.23":{"name":"next-slicezone","version":"0.1.4-alpha.23","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.23","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"488ae5041d02c0792f645e3f4500dc1f4aaac743","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.23.tgz","fileCount":30,"integrity":"sha512-HjMtqte1gGzlqCUKRAWDGhYQ+yrCHv0DCShkzWOacm5NFruuE4HxpUABx52bZdCb6xwltER8YdxwZiea3n1+vw==","signatures":[{"sig":"MEUCIHLdqnFWs2jzqpC4+a/49Yo3MEP2gjvh8tm81mTg9SdQAiEAwsJRdxXQFyCu5gCVMKrYy1AMQJQeWVA8LCAnP7lPoXs=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh0xUTCRA9TVsSAnZWagAASJ0P/R7OUG7uRcJnxN3tjMmh\n+HoF03CWdyeA+A9VWoFcdd2xnn1reuWM/bIy3UsccXCJb34Iigi9elsEBCXy\nGLY1DL3tjXMLW3j/cG/chXWVFNEddSb3Eg4vNFWocWkCivxdxMLyH+b9NY+i\nyp0YhkJ9EOg4P8k9OofU9oapl0iIn7ZTXksVKPNeOc9+Jn6Y/+mqPE2gmhb3\nRNXcVEV67WXBLFiJlq0Xx52b2svHTcOng4g2lbVR14dpetuhAlX1ucmUedDZ\nHoYWL030vWahv3jWn05bMduUVJ0aDrgtsOtUGV6i8KY1BIZ7B8qRoODCz/PY\nXa7JT6951L2owLwO9ZCSya7qyEA3Fq4eC/eLhw6hcAG7Djs3n+3Z9imWNMPT\ng+2t5oz7vw3x6+aZSX2lzm00m09FKNlQ2Y+JQfM6Fi8hzdmoIV/gatIEoNnS\nSyZBgEVBdwCwSj+KxwNyEtwh0QaZSeRDDTpQ2a6jKoy6qQjjvw4q8EBfnc98\nmhHTdc9Wn5P7lSp8914cgaMkYWBcFexyP3Hflg5K7+x/yl0BL1bWCZchpJFQ\njMEHWgRs6+j0Jus1DJDRgKoJxQuUm0SU3XJdGGZXnd/io2IftMJelHJBA8Pd\nb2HAWhp3Joz7ckXuSXBE+s4/1Y6svg7PT8gfEDlZtSKJiiHkRC7ruCkpPa3Y\nJNl8\r\n=VlYr\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"60cf17d6c9aed13d3c23fa97f338b8e2d91857d2","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.23_1641223443583_0.21768824820433008","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.24":{"name":"next-slicezone","version":"0.1.4-alpha.24","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.24","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"2df3168e902932de92f498805a64412367421a38","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.24.tgz","fileCount":30,"integrity":"sha512-EJSoXzDHgroqf3VrAFu8b2fMQIu/52lr4DQNHFRF0LfZS03ynmAAzTWKmlyFx9DMRuIuWqLRZnl63ImhCQUzSA==","signatures":[{"sig":"MEYCIQDC5ZJEMPcGD5tZqjJvZkGMLubPI3ndBK4DFcMZgg385AIhALVIgfMUoESE733IXAy3Aacewb1Flx8vIcYdxBL4ii7v","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh1HswCRA9TVsSAnZWagAAlIoP/3oZODLrEAEEyFNyTurS\nkx1BgRlLgCyUPndErgF7Ag5g1fvCmqy5ey9rQIvF3cpOwjEjtWaZbcvmXcBN\n58l4iM6L/d1C86RDLCkSeYEnsqMOl+fgIBXoKxHYZKD9Yr+sXYdViuuybvjo\nlz3B45257SVJMoX+vMy4p60UzeKNRVGDXGdy9ewN0kWUdRvJHHRgMTrgsM7n\nv7XiC31ypKkGDtn8Blrl666YyPsSuZPimZxMG22aLm7HJg2ToZlzlcm4svc+\nXF3fEUwQCkYACxf36T7ve9Q27kBKXZBEsRX7ZTjh0eUKz+G/tyF8ETa75uwc\npIyrp7QOubolrtxDExxJWvuUgIikmxCXyvYseLHoEYa4kNFQdZUjs6UtduC7\nH7N7e2Xj9XqkjKgHFnJEu7U1mpOyYiCBShds5wrvLl5lba5s6Dh3lAA7Xwsv\n7Yi7Ti0FC4EpOwEWrT2Fo/CGKhw8SrAsJ9A9uMzg0h4L9fGGUEqR9VF4aDfq\npny9vZZHcKG7ed2HKQBd2WUK0VYqC92BsVJWJfhqsgkTg7X3Yq4ZQ73y7x1X\nA+vijXjr+J9x1R7jSWVPgxVnAT+nHSBU8vnHO7/EcnuZvgDvhk2GV+f2qFYv\n/Ozi4d3rR5Zlp9cCs+nqaWj8zgGoPUiXaXHz3MRGxMyV74ia1vrjWYPWj+vT\n2acW\r\n=Czg8\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"a75667779948b67c4bf0d366b02c8f7fdf7d3d2a","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.24_1641315119926_0.7673505563711842","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.25":{"name":"next-slicezone","version":"0.1.4-alpha.25","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.25","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d6306afada1b147f9039984bda06dae7dcdc8533","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.25.tgz","fileCount":30,"integrity":"sha512-wQJ7AfopgaS4xTTjj07IM+KDXihLyLL12fN2JKdPsmkVOPwvcl/L0Ox02+38EzUqMCL1bayLFPt4HhMcHTGZXQ==","signatures":[{"sig":"MEUCIQC05xkYS4Z13qEBwElLYLZbaiav8uvY8GdUltY2qhf6iQIgYGJ3Qu81P1OHVjvCHFTdMvb4ooDBDES+PB3vmllFlYU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3Ef0CRA9TVsSAnZWagAAH4kQAJ38WE4nD5p4Nvx5hwg/\ncp4ESAXS/V2lE4dSqjXtY/2WtKpqor4pfA/F1qQYnQYVuPHZh4P97Rem43zz\nzRY1lCA12TFknw8/eLtMfC+k62MY9eaPusnTd1XgWH98bYdp0nVJh60c+YVl\n7Y45IE+sCgZnjQ6QH8QJyc+b508hycXgHsusyswpYGYINkXYRCJIIyL1lyhU\nguATIXFhDnxy24n32/Am51/HPbJFfHP1BnEalbQK35Y6D/3F03GL/zOgtCUM\nhvx/LOHWQlgfwQib4957L7tiNNK7JLZjCZbfWIyo1FgYMGvO2na0/ZKE/3hn\niOmyf5VTO2FlMbK8sUOjzJWJfuRNC9cRng4Sy+1FoUwDAyfQYAWpLwI5tQ4i\n69drK8e4xKgLTlZmIHPzSmwC3Xxh+bvfP+25UhzhiYxLngMk9v1gWfhmIFVy\ndX0x6KZBrSBBd+6PjJ9S0Dwrcvvu/5KaozprZL1zkzCd0rGZV7ppraIax3ze\nJgpHEFuNTc+52+YKeFowqLiBpZGmD/kHTY66nmpMRCkUgazdpJj9SP/lh3oh\ndlxofFafvj0g00y/aSjazaUZzNQZ6aDRVppuIV9CGVKN31dLJxe8pvtR7AXY\nJClvF0dY9I00JMHXwbNgr7Q4eLa2EbRQ+l1X/uDP2NXWFCjoeqwQd00b02cT\n8Tvq\r\n=vfl8\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"802d151e175b3719834f97b45a7871083b96bfdc","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.25_1641826291840_0.7580321687574199","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.26":{"name":"next-slicezone","version":"0.1.4-alpha.26","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.26","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"93b21a3aeebc13650e2d5982e51844141e93a7cb","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.26.tgz","fileCount":30,"integrity":"sha512-8Pa9T8ktfbhCshcMa7+/z5h1yOO6PPSo9YiPmlJ7P8GYPfsvcyjO8Eb7OCOVpSuifJrdyUGVEH4eNVoYLOyXag==","signatures":[{"sig":"MEUCIC/E+Xlr+5uZhVrPLOlqg5F0jGwzhPk5CmFwY7pI4k3BAiEAnsm4dGPmFsIT/vpMurX2GkPUtv8lQOVbxRP0ecoIcZY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3F5NCRA9TVsSAnZWagAAv+gP/1Fe/OGABQ/C8DW5BaT5\nXm/85JniYunqDi4AIKmwPhPL+eRl5I1tA2q2eGGAEyo883SVdGBCgzFl2avm\nOjGuGePMPH7J63Sdl2mGXYLs6aVkXWvA16riiebX1tX2uYwUh0TnJAkXt9QP\nK63EIws5jhduZI7zk/j4ecvfbfq0JIAHsNHemTA6axvbKkMlHn4fhIjUXaT6\nizm9hcUVx0FtyRAOi1tm7rL+7Y8o0AR5muoPEEzuxOMeZo+Xa5nhGWcLgMA/\nvPojectOr/rCVKA+t4Nwoe/oq46fsIeBNIiUJ9XX9x3HRDuEyA3YXBLoGahe\ntufeA0hs8cLjlC88mYLcN5PhK3PF7xRULc6rZ7kcdDrriAYNXrhWPJMO+YtH\nY4H7jCKnwlfMOKT3gl8kksV/ko88YisY4hPZW4DNDGT8mPD1tlMDaGqtrFoQ\ngL25cnVGFNO4jV69LR1D6brGsxMmft3huDviAl+4I36QnF0Ts+bF9i9Z3bpd\n1CzIYUIX8LQ86eSh1w5BQgPc5IwFjg8HiqdDU4CgHqpm1wjfhG4BPVzpgoWW\n6SxK5Tjo9pgqolhU7FafvddawZYB4VY/2lfWxQDOEl4kLkpAYz6sHZz4FhbR\n+xnxQvuFY3njTP5pbYeBFvibHCAgRbu1BG1VcrT4EIlzUIZ2Pho4dLqQQX9L\nIoNF\r\n=t3E9\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"59640bb59b9054e704aae588317aede88971f1d8","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.26_1641832013383_0.43771738322851794","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.28":{"name":"next-slicezone","version":"0.1.4-alpha.28","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.28","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"a337bbfd67bf5e80d831f7f2681b711640593fb0","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.28.tgz","fileCount":30,"integrity":"sha512-kcaFlMcSLTJSnkURGISczmsarADyAcnxllqc3flmr3eyT+2sDAYtYzJ9haVh2awPvQajZGjdPczPnLFzvW7wsw==","signatures":[{"sig":"MEUCIBiTARwSuEKzccYQTwIprQtRfTabUqEsNDqV9dA9gUHhAiEAtE/g7jAY3dHWeMm8NQ+OvddGdXKLdLmDot14zv9X+YQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3YenCRA9TVsSAnZWagAA7oUP/jLk1o/JrUXovoJDRNfo\nf7nUJG8maFvfAcCREYiJ2dXPEzqscvKs9U9+MtcU1Df/cLW5bMblLIsjifgQ\nRljPXTDY3NUrOt38o3R8xW0WrQRjlNQszrLkObE6QNCtz+g/sMBcsOXyH6Jb\n4CAfBoUsuv3601ybJDnuheQC6dbeL/XuULFJhZO1PEnuMdh6AMY6rxR2bgnz\nLMTLzQkGRHzUKygUkt9HRn9AAEhT+80wswYT5lJiLfpLBDXtKDGUa8rnlJMo\nRzfBCrcsV2oum4Oqr1tBaVitu3IeMYm47Q+dLdyiuNbpBFz4u7TvoXpPKsrA\nU3NSP7EB24b3GLJumiIUAqOryGdn+cFiWGUgoUz9oqqIipNEt4TV2z9GxVRU\nESFOkwd3ZntkUkso2anNpMqYGQZASe0yO4RTwOL/hXTHpKzgJNvACtGEoavP\ny/KQp9kaIvfWUob2oi48UAo7nt8zmhZHE+uem5LDY3UHJgoH/eqoCmbaF6cs\n7cFt4qd6YfjBzaTWgn5WxpU56QXJydlS7QZmRKCjJTyu4L5qqkshv22Bj/tp\nNjEBV3YowSQas+VAcxRszt7YoO6jQqDUiMr/Jayk2yO80apRgoDsbuf3yYje\n5nz3VxGN8D6Kr5ufFsWCpbXzHhdcelXi05tAr7tabfsQZboOTSysrRFSgv28\nKHDG\r\n=fhpY\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"18638999bb4d887f9038543586232939bf838f42","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.28_1641908134994_0.7985509605665713","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.29":{"name":"next-slicezone","version":"0.1.4-alpha.29","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.29","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d9394bc31d1bd8a9767ec23cbb4d5dac515f7263","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.29.tgz","fileCount":30,"integrity":"sha512-eRAAeVTeUPMUnzh4GiOBy+sbJWx2t1rSVg61Skb9oyfzoGXiHHDdc8OzFembbrdkp8EJqjr7T6W+PewzXhcu5w==","signatures":[{"sig":"MEQCIAPI/broHobbiLixTpbSxMb9svm5JrZjN11y3nyi8KQnAiA/HN9jpoc55lt0PEUby/Fb9tOiLf0ZDiXIMXrQ6tLGgw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3ZgeCRA9TVsSAnZWagAAiI8P/0MjAX98L0vBBQ6PXYQ1\ntDp2KLU9n6UEvCIqZlHvuvwjd3pL9HQ2BFZB5HiGND4ThF8tF+/y6D791/Wr\n8WmtFWjQ8N3+zJAspErG3Ps7y5OPDqpVAU9zX86qV5RfZPlLqPMMWybhSnkx\nHCDLANN3gNhQh++UaqWHcrrvVp6/2qeAAPy/59njeeQlK5BV0/XTj1t7OcBY\nkx58d7rB7uJOSvH0CckbCmtPaEO+y3DvOE/Zei5G6f0JrXMQnR2fwop7582I\nbWPEc7lsmJBPbKXrXMJyHcbvgx3U5HNqM8+WxTL8vFd/qSw4mPFv7xB3iskX\n7NQjzBKYbPCSCFw5EYPGwvegzX40Q8X/USK8LnTjNP8ldFk4R8UqOCdrNOvl\nRSaQDZHvupVerpgGzFVIaaJMVMEQQfwvoFAdkLvdGHAq+vqV6D2VGN9d28mT\ngANfaip1jSYuGaOmGDaXrsTvVf/MBqFI/cP8/tRCQN/e2Ie8ROZ1xJoEw9gL\nqsHywm0fw9nZ3JdHGweH3XCDj55nnVwQgjOm6lrOs5iuryjCURXhUijl+Ida\nnoaZOKq+SosFgn9J/85qprPI7ss4sT0u+siKe1WHE+vefaEcgDjIjqZCPO6c\nxB5omnHYx4EM46WletLi09YfsS2V3dna2DJFzk2E1vx14NQLdOOC9hFeQ3hW\njLht\r\n=IHsW\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"60187f3931b502e4ca34afe0ddd7a54a73ae4647","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.29_1641912350645_0.7490402112195835","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.30":{"name":"next-slicezone","version":"0.1.4-alpha.30","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.30","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"2c03839eb8f441a58340d8233abce3c1eff64afc","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.30.tgz","fileCount":30,"integrity":"sha512-KaZ0lOFLDLSa0W7+ICvjBDxs5ZU3fE8wEXL8dg2XE+Xk00/LupzeWorHSjM9VRdfWEcfT688fIaL42/lRgibJA==","signatures":[{"sig":"MEYCIQC5/10YDVUgsPY+jhgWeuP5r3pt5/9eU5x770hZsOxzUAIhAPiX2czds9ZGmlCgmxULaS+QeRIpIwvg7fQN9gzMWgZu","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3Z4jCRA9TVsSAnZWagAAC8QQAIQtuRA8rMyrUnKK9eC0\nyOyGSSHBiaXuDLNtSe+earvI5j7YBkFsyfUG9U0r8CTf+AqK4pZRtPdN/tJo\n2NO0bq0odHjQfgbr+x7i9mVWyx6DB3y7uWRqZ486eTC9bNKO4o/SOB/gAe3s\nnBZDFalFWmH3iEL9qwwTRH6fWRdprQ2AvyUTOUWQIHwwnCojh0OT7iBB3l/y\nGcE86jiIja6LzCBp1xDjXVipGeBkH2bC0li+9bswxL/1IukQUUecLmbXZ5p0\nimP724zmYNK2v6ZopTjQaYbcNCB/Y7bC/JSao+tFplvPXSXM0pwyA5VAyxU1\nGN2sEVY6SZEt+sU3TeamZxeT+wmGAezRx8qQD7nkwHI/ibT802kkCTGq1eOl\nLGt3Zsw4LbDsotH4kwz/UdPMVffkJMg09jJysTwEwAvgvG3K8X5nV/7M12mo\n72jd9xVMPwd8DHW/WNbeXdQj9bEzaQHe81P52sr+mDcxgiq7AiB7AVk+jO7i\n2uVD3vRsFAz0/Zvxnsvs3YBNF1TBrH70QUozQZYUR4NtAdOrNoFKbMLc2Crj\nA1wH1uhc2qco/JiNQaQ7kOuhhySMGdTbmFyY79u8Fr/RRp4vswHdymioqdfI\nOiZwL6Rr0ORudnNh13Lj7Du6TrPpYm36rXbjiRuD8OkGMtImH71mYlpsTiNK\n/Ao1\r\n=L3Nj\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"799be38e2e03225c54594a777686dc4de7b4918a","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.30_1641913891378_0.2779696557321638","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.31":{"name":"next-slicezone","version":"0.1.4-alpha.31","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.31","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"589c784597ffa78e89455b1b6016945f5f27336e","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.31.tgz","fileCount":30,"integrity":"sha512-3re00icyhtETvaabjNgbLbslc95l0PjhQV55E7mGTZDFlorzbkAb6+Jjuae7eIvqYGzNnChCzVKUx7pkl6nalA==","signatures":[{"sig":"MEUCIQCcPI2LG/kKa7Lrunh7ShOHoLCZ3ERDSUSUW96Z1NgF7gIgF7opPEw5mTDVL+tuDoI7d9WNp+246OrQxKMDNSKDy2Q=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3rnOCRA9TVsSAnZWagAAJYMQAICMxMpP5oeK61LWI8uN\nhY1m2GIJTEC4VoJQIoufBAs/c3ksPJxovbqqAlCC72G8pjLaLkNW2ONOzP2b\ncOhAhgQ+x6Zpus3ARXvWAX3cXyqvIRUlyiHZUF0TxJOem9fgU+4w2TEjyOvG\nOUPkn/AtOFmbblelXfyAeF3AcmtQKnwZMBepzB7HIAuWA1oZ2fppNn7lMFqZ\nmnmt8ZhG0Z3LtvgRjEPKvzYROS+O7HU2oRV7z2HtIBrep9mZ3uSZFwmzYJ1e\nlzFCbgexWIAC0oubgu1rY3AUb8LwDcDNmfiL3D5H4nGxJn13lIL804A9oXlX\nswmo2LqX8q8REAlMC4SckGFrYk029uNcEkSX0b0ScDV3up0lIE5wwABM4WT/\nXgVOvicP/BZ8kV+/0iIfNfv0lArCQeFHMY5Iyq42CZQhItfH7/JxEaWj2jmS\nAPUv/+Qlwt4OC5g7iqPqzFy/NXRkynHLIrztdWRruKhi7HZns0NS/BcGybO7\nclWf0+5+iaNPkv6v4UWJjibUo838xcqrJNHBnvADolAIU/leQvLlmaswf3LO\nbYOxCaHgZ4HirNGdsv0ytdIdQRiYeg9DfbBs0gLJwtvfYgprpHhTCxL4tKek\n58oA2QpB5sYNvqxzhKMpJCPxUhMvbzHJ8asOno5kY9A9+5Z8azTgTsEM3G6U\nR8Dg\r\n=ktZv\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"e5882f702eda78c0253302c6a72b2bcb9cfe4093","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.31_1641986509949_0.1025480484593062","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.32":{"name":"next-slicezone","version":"0.1.4-alpha.32","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.32","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"5ba9b0cc0e2c6a64ebd234f507ae5ff160afa4fe","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.32.tgz","fileCount":30,"integrity":"sha512-bd4QehV53vyO8YXZ31MKZhxYC/Q0xL2fZdzLBjrGWJmVrLteOrmso7aFLBWFc0Mi7Ea6EfWAyUTVk9+jwt8+bw==","signatures":[{"sig":"MEQCIBeAdRwnq5ezZJZU3C8C1BfhaAnSnVG+X5pJOX93n39xAiBIEOCGBTuNhfMVTj+J5RdxnsNv3htTu4S6QAJgamITjg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3u8yCRA9TVsSAnZWagAALKUP/Amjh31g3o3MD/Nb6hQm\nCPqBPFbRrNX58eZgROMhF/YqUI00jU0g78OqPfKD1M16xPwTGr4ZV9nCDb25\nYvmEX3Zif9i7afZVhu8fvw2sCm208bwjaar1AYutzzb9sNY630bAEb5SQgWW\n9XeHPcYh3i35btITbeViCCb/rC4sx+RhFt45JJO0PC391gP65iD6SfK/NAa2\nQxCcv5co9CltTzyv+TJNRWDhBczXsMbaRR5X35pqSkeviL3TN6/O1uBxdJXX\nAwQYzuTv3m+SLUBTgvym9tkyaBZgMTKhz++9vavO1HTgi8o95CzKIpitN/tB\nTpo9+06SUcpU1fdtolZVvuIn6V50HR8gdpjgIVWck39w2eM29i179sxAye7G\n5+81jiDkOJU2DDX34mqvqetWYxLuIliVJjKAxlegv4NGNX54WhJtCHEico86\nUgAaYuFAbEHoMfeqf3WgiVHM+FyeHqO8o8YarYSY7YahFm1ifsjv8h3Y+aH/\ngsBllvqqt3St5c/yc6/1nL39RIt9UF2Eua/F883TBVvfX4J9AhgUOcYsBBrk\nGMCrLhlr0cha3oMCs0E6IDI+oPq9Pg81RPzKBOTGb/G1HVDz+SlAMDEyz53r\n5fCXxcf5YBY5fJ1LMhJEVVutVzr3FY14eZezxELxrMIPGNrvBqGlcx+/lIkE\nUTrg\r\n=Kii2\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"f0d4eb7da6b19f9f21701850c86e5437fd1998d6","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.32_1642000178681_0.43456470750102394","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.33":{"name":"next-slicezone","version":"0.1.4-alpha.33","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.33","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"fee5d22506287bc485d60ac526a4817e7d830f33","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.33.tgz","fileCount":30,"integrity":"sha512-RmBJVqueNUqt6amV9P2sO4VxQonBXmMagj2Sl6bTXWwAJf9yxMQ1YPRZX7u4mdwSdSIp6JrWrtp50BJRG+P6+Q==","signatures":[{"sig":"MEUCIEoxlQycduZ0sqxugUTTimYVc82AVi8pv5Kpzvm8BJzdAiEA+AjzA6wDcxXLHmCjv7aLWt/NgT2/LDCNpT1PJGPH7yY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3vO1CRA9TVsSAnZWagAA/fUP/3m8od518XRr85hBIs0N\nfeTRUXXVAfNcmfbYRDa8sCr468m3wWafk06Vija3478+qOrui42exwrtrT5e\nG0wjiSbmS2z4/BfdG/G1uP5UuBOKvSOPIZFKl+y8h274AbIr44FQSLXcLD4p\nSlk6PdOtMK+vP4be4uqwtqIg/UoOj3ev11NFGenKLgl1OuG4ItfAl3ROxHJE\nynue7WzrSnoIkvLTZqqmbwst0qCcPgSGCAO9Z2IAoPW3fz2+95B8yF/+JYvT\nK6lz+EA/aCoK8BNzSuERO9EqTBbVWlxNlxbs26JgZYO4vLoVbc9+EHdKcOpG\nPASoG75En2H7Plzvkon7PO0d5MEGnupliI/nXvIHVDylTQgnaiosSb8+JX3+\nHq2PaOPJ+g6WAjfjt7YCWqUoK0+NCzjyVUMUb/0r57EiHnnbulA2cn24dDni\n6cfhWjJJqLi74mqxKG0eARGLj2GinZY0nKb4100KuvX4ntwYNUGA7IqIYNNG\nscsdAApXimIG4zEww0D9qW3uwlM5wf+b5RtyRjEU4so9TaBmrfcQuu/O89Ij\n+h/CHZCanHSJCuAbuktSVifysK7vWOLjbwfrthYoyZw5kmt+5yuVVmO+WN32\nkqKgTZ6WDgvXjcz0OKIglpqGE3kZqcT+Eko4h1XLpnhI6El6CPcPhOIvPj0z\nen3i\r\n=HNQO\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"9a0380ab52178798110fd40807c843399ed487a0","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.33_1642001333468_0.7038820392678597","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.34":{"name":"next-slicezone","version":"0.1.4-alpha.34","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.34","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"027ee71c90c3f685579c44e9f19acb846b06bfa4","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.34.tgz","fileCount":30,"integrity":"sha512-sTy/Z30ZWwtq3xQwRk5UWDySSmLJtM6Ix3CNFpb4PG33+g6YN3TDacGnu6Q4miRh0boeadFTAf7QOUMPxSbGQg==","signatures":[{"sig":"MEQCIB+HY/+9/AWk2RvOCaweqdKO447SZUCsyVf/ToLAMsVeAiBvTO5VABoco9JAyJXjLHeJm5GfupxA4ekiV2QXu32OcQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh4AjGCRA9TVsSAnZWagAAlawP/2DF5wWz/TxFBk42IuD5\nNTP/SdvSLLRPx1oVfVDlpGuQ3cx2x64+GzFRWe/hi52vnRAdhXOpLq1Abwy1\n10g1JzRuLylyNNcPKwRQshLqjlfqG2gTA1mK+MlWfVIAM4+Gz2ykIOSdZUPB\njEShwD1eI1qmq31l3/gEWUrU0UNIw+8TuWPkuK6VD+pyqx+x467ZEI9Dl6do\nTnxtGPVtuLymvFFwCF8T6MBCE8JPOgj/LcXLJcatklZMu09BHSvedh2xhz91\nI6ZiTVmUXbVMhLe03LoM7hGieLSN/K4U5aCmtoWhCP6s0sx+vRI81r8nEvMC\nECunV6ZWF/VyYgQg10xq8hCsfRaFw6nDEyxILG5SUnWL8bLmpnTZlyQhrhu6\nNyMHyt3ZuHGFoXjGpeLWCr8iX+ax0KCijNuDZrGCrUamClGut4hnI//W70vR\nfHOcskcHpvNE4gZVDhn9XhCv/TLx6ZsavOB9WqyivJLrJt3p4autDuy1yuGK\nFkVtCI4/S/SUE9kJ7AhjQ6PVivke9FzGT4qeJiVH9MRPccnjOvsiZTA9GbcU\nmWGI3hEJACIYYUuRT+eDqZ/sd1cphIe8dL12qbe9pOobc2kslK4MxXQ8QrV7\nowG00xHXIy0iOJM/qEfVss09BBh/ao6gQ86MeZI/Ev34Bu8llfvq30EY7doM\njt80\r\n=nLQ+\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"c41c4519254136d53caee5b6869757eae59345ed","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.34_1642072262246_0.03318097659266339","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.35":{"name":"next-slicezone","version":"0.1.4-alpha.35","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.35","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"160ec0d412f97419261d08932c43264c4317424a","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.35.tgz","fileCount":30,"integrity":"sha512-dPbmyE/JFfRiw1ZzZJ9+7opL8MLBjRZy46eReub9X5e8YnF3UavAZeIuffqrE1aWvKbADylS4GSaT/V5g6xnqw==","signatures":[{"sig":"MEUCIQDWvaqGUsmyPfrh0+h3jzNcd2jS/OGyvgO4JoBNCJOu1wIgTKdqpHw6uvMNdKE9zzKBJH0ap6jfffZgWMdvrCg24T0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh4bXDCRA9TVsSAnZWagAAbTgP/3AdWSSRAmm2m03a88dE\nXibFJyUHfbvebzHf5jWVNW4fD1oBTLonk0El8YNdwt0lINP8y5UiskJdqnJJ\niuKMZe7Z5UEKYr4n+YCXm13o3nl6YlWX0n3LIb8K6uiz3E8hfkgpTg9n7loG\ngnnIz48hVQGAwf8dNwOVtbf0L9K+XHnqps+kvYUsVwWrSBqBFk5UTF8SQadB\n8NAY8aKizaUmb2uzjCp9cSG6jFvZpntZpcN19B+kKpyf18PgBYoDU3USHGYW\nWgPUcH1+zI1lK/7PO17GX9cZXhviJQN38mrJYWAkQzceJN1AxNJVIzXql7Mg\nLsjkE2/bVcvMk+e76C9QgBirjUPyfQBNwVbKcTRvtu35E1hHb2vpoQTmfhRT\nMEr5AfiwvG5OOXPXOS7SpDeuz/7i1NWUvjypcpNW9cZXIBsUdZnG1yx9XsNG\nsyM+Dv60Cg161Mr3+moVuBPxe6gj59Tr2FpMPoMPIIBAfIqnWTqmkz2VlqHk\nmEpLqlWJog0Hh58mkeZTk1Io03xElHuS5LgaDTL6JdRoEZv55yTRzPN0nX/E\nRj8tgw2IaXtvNh4sTejuZ1a+WZvk5x9pm1Jo4walrlKbS+bcj7hw88GdgThY\nxwPgR1EhbnJWf+N2NoIQbF4Ai5LpAX0eRhLGAgSItmOLK6x+thA4Vv2J9MlP\niX68\r\n=KJP3\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"a6543e62b0a579543a371e77db8610a44fe18fb6","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.35_1642182083775_0.479338951541356","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.36":{"name":"next-slicezone","version":"0.1.4-alpha.36","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.36","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"c0450466b882fe11002f2bce181b509b063446fe","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.36.tgz","fileCount":30,"integrity":"sha512-uu5UVUck7Z3gLMzk/rAl6kGlp9EQU5nvK8/6fkwnreBET7IXJRGYQ1GkjaX5hVWLpDqy3UDlsqS1DhF7ZSujzw==","signatures":[{"sig":"MEUCIQD33fX3rCB7tMkRt5wp1F+LGBNWIwOshPuKSbUoDZ+JuAIgeCSndcHuhs/R90si8uXvFXmBAPiV+nZm8fdiRLOUk/I=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh5n7HCRA9TVsSAnZWagAAWvwP/2g7HV/P4Ilenma3ccxk\nHTVZkrN2FaG97wabN8VOZdXYz7hO3DXChztXI/DUnEd7b9zVlhwz+NCgb/L2\nMLZSjOgnX5hSLB939reWPGMKPzCzL4PXdgVyC2l3Q3yLig2399shBIdzWcOh\nMMsTnbS6niG0AYH9SAS4le0UP6nFkJi4E4af+R48H8ZydG5OTGeuAyL5kvZp\nuSc2QEmGwSGocjYCrkoKAWJGlxXeDrCjfrqLL8fkdOHoQBPjCoyA844QXaBO\nblEy9pXcEnLigK+OeGPilJaLpCfy9MAVTGdKmqYSEqx98a8ui6iUWBR/quBD\n2qQ8hYE9rgmqB8fZAll6KB7s93zcPwlcqwto6GkCkx3yfCAYlx10FJuI3LYc\ncGVicTjhavZ8HoIV2S/ALHjqyal33fxzpzGTjhwtXnRJiJSMjI9yeJh+fsas\nVXJPSkZ6Cu7RKCMyY8Rrj8Q0dJp5dh9wFC7UwzNX7uvAnNt3U8p2T+ecKZM2\n0ptLPW5cJmIRxv8/ieTcDicBypnZCax0PXjQn6XuDXp8wmFZjyv525dcN3vq\nvzjB9qosLWH/rdOaAVtmaMLCqYwDEA5bSfScF0FkWYZvwSFdW4YFc8hYtraa\nq6mVrcHLj+60QfZDaDyaNKyu4GRZsm3VmQex6rVv0JjzH9vvy1jwzcH3dJB2\nrbVq\r\n=KGKj\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"865d17d04b4ec35b2f2aae4ff0e1c3cbafdee9fc","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.36_1642495687040_0.34507891356831233","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.37":{"name":"next-slicezone","version":"0.1.4-alpha.37","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.37","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"75d1413d05320adecff5b0f5e012583865feb601","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.37.tgz","fileCount":30,"integrity":"sha512-cSuK0FUxDazwJeroS3WJLyV5hky0wXhlVdZuYgCogPAfE8pFC6vTsPs6h3TxjXqFY/FPkvZHUlJiDTBBKjE7vg==","signatures":[{"sig":"MEUCIDbb9qWyZa3E8LMqj+Mv4maMVmrCEovMY7YcWCwHC598AiEA2xfdtkQ5OWZgZnnHzYt0xzWafmgPP/SC0NHUjNadlKQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh5p8WCRA9TVsSAnZWagAApOMP/RkBD9+pTg6a32g6gGnr\njZHF/4tp9zU8JDNqB5QWIVaYShgkcp7jrUD7SELirVFHB5SeknG44fcnu4C/\nX2N167AX600b2vH6wlO0lAQ+ugMQylXoqiX2Shs5usdwSyV37kuYb8yNoC3+\nP1QTE59er54IrSTCpJNoXczkBwJX2kYnT7saKLSk71bU+OFs/8hszmisZ4Zp\nrA+/NecPTE+8VNXemiN/fC7Lf99qdEbFaTpZL1nckfAN//lGfnjLKB9ITwCe\nLYZHolLkyMSF4A/qRNLJay5BX/qu1wHv/b7FTcxnF+zdNCgNX1ic7D3xYKMu\nZZo/PoTB3Eva6zxylg5Fkf82BqdgXqj0LEV/P9cGKS0MLME1eXpFoRDxHPDl\nSJr0BK97KmJit0vVklz9LYPxF7vY3L6oK0GTQfT4Fhpl+5St0O93JHxhUcZK\nVtjgGRWZWtv8XAp4rTvicdMvcbbWuaAB/68/8xadnJGuEOlt4T7KCQWIQEFn\nPQRxvQI7OC3Cn0ddZ/WnQ2Dq3QAUyyugi86VgZpJfOMg/C6ocC1WKeLmWygP\n2AGI1bT9iyqg5g5ACC0fZMuavK+75vTrP85Ie9CX6DXiA1xWHiBtbSKdf7P5\nNISpTTveA9/ck0t998PVXT0cZ094p0reRdIdLNST6fON6onHpMdAtKtb+wVY\n7V9A\r\n=Xkef\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"3905fa35d8f027fe7ff94c548ac43cb43ea73871","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.37_1642503958523_0.9347736296445128","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.38":{"name":"next-slicezone","version":"0.1.4-alpha.38","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.38","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"dd33ffb1c10c382a9110e01374b3bb4d57af5b8d","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.38.tgz","fileCount":30,"integrity":"sha512-XBk7KID2789uaCRrLvimGDMojInTHyun9o6OILujbt+GVguVHwZfgT4bPjNg/uGeEXbtL3RaMefrM9AmnX/nQw==","signatures":[{"sig":"MEUCIQDrRUetWRpCLW7cIUlwTs6imNxwBVztlyPuC+830jwz+AIgX9PjX6b8CRqc7S//AZ1yfv0d3M67E/9l3j3YjFGhSpk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh5sFgCRA9TVsSAnZWagAAjOUQAJX9H93kVB48O5SUQmYe\nsyv+p0Uobjt/BO3XQIjImH+ieKdW8vJVDXclY3zfrK7sEDHM1R2lgu08v5fS\n1kzOu/kzaW5/9XcApUnnOzPbC9GY1XTx8dOdaLr8m/B136vLqh/Ui/8YWKFV\nxOVs/O59yPdlHOLTzBA2DZ6R/xXaLRks90+m4bgR4awbECt0b6Q0yXyowIzE\nAl+2HYObL0o66ZUvQHxiDTSIoeuXK8c9l7cXe/mvjRuMLv2xY6xt+kxEehqK\ncEVHHxOHjYxS31QsqKF0XIS2qc5WykSY0VdJSLAmbHCAnKq+eCkvsw+kWh9t\nG7LFZcFylf9ZAfxglOELRmPixw6sCSG34IEHC+wNt/4b3Fbpds5cVTo34ZNj\nbgD0jw6wdi9YkOk2hQK/rmTD0Z/C2ndjNC8V3OK3nQJar3E+0NXuT9I6p93s\nVEHBgvkHDMrXweEcrzofPR4l1f/GMvWzJmOnYhMjNff/9kwONXlmz0lB0FTT\nDWCR17bChCwOqsW8eXG7ZXoUXv6WUEis16P4ZA6GJffnDzSBZgVhv1GPLsAV\nGlMoaopSn18rozJeJtHdK8CJsEHIkAZVWvanc7i7hQXlBvdcC3mevEEqcUuF\nMMR12+v+vwRrnWzxzFQIMPB3UvAQJDgdfgA0YZLf0J7anzKYX6FMGuA5s0Ae\ncu6m\r\n=ox70\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"80ec9381645a79d57b30416b8a1528411bf997fa","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.38_1642512736705_0.06254781663876852","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.39":{"name":"next-slicezone","version":"0.1.4-alpha.39","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.39","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"cd9bbfeaf3c1ae74609d275638e4f7f593cb8bed","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.39.tgz","fileCount":30,"integrity":"sha512-zvcyAZOGZ62uIDdRRWnSl+cjNFV95sPQeMsmU79dGGa+jYsHu/UlH1PkMQazOB1LxVngJWNJ0HsxUUf1Zc+sbw==","signatures":[{"sig":"MEUCIQDc0JunqmGuNdILTOo6Qp2h7sQdE70uto5nkztrm/AE6AIgKTqQ5aADQBA9MEqXFCGN6HpbLJblXPjayyHCJXUSI0M=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh5/AkCRA9TVsSAnZWagAAEkMP/2pAjLFwzVokqqCOZQrq\nxDPwcI4C4nb5mAzPdq52B84n4ly1cy9lhDxIx0mTnOnT0yMMmM5/VrIW+6j2\n2ldLgc0WB26RhHobe2poEf/4UM36QqzBNdq1b+MLwiDPzI8VNLw77zoD8qod\nug3wVjt13rtfNUzFbnfX/ZUEQba0znymNXkLXWeOL4XIy/MYuySogprfHw3j\nz6oWT7rnXu8E/7l5t0tICdIJXitmZ2ljtdIeHU3MgC+NiJoVLQ/L+GK0N6Mu\nx288eB9eT/sjlrkH4CrwxTuo/ufGK4460yEBL1rtnUmrAfty5LNTrqkZvraO\nJXzC8fl27rK/0CMVqTi4y6S1JAI7CsGC1c8XkIzKxblij/4wAjhdlkXnarQ/\nsJZjDtS/hoOG1ybBpmB3JEbaruw148nUmIVcPC6zwpue4U5o+6GBOEzqZRDG\nFTxC/ZmX0k0KR0N//SFiv9XXLR4uDQltVhLCxnGFCetEAJOvhmvIyrWgkR8V\nkxv2gwTQR872Qq21d5CbRVD8eg1ctKh9uCaJ43j0ZABUQzw1sqP/2VIkJ/tD\nUBD5EeCelDzTwBLXzlB4cutAsOVQMhZIXyewddolWhSmZIQTBPJjmfo3FM9/\n+o9q+yo4SnAmfNygFWRV+KhoE9b7rl0iWngzZ7PgLzSLLOSKprnbLvtWAQxD\nzq1h\r\n=t0Jo\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"b248c3e33d76b57b5c6dfbd691c4c5b211af27da","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.39_1642590244226_0.2729862891483634","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.40":{"name":"next-slicezone","version":"0.1.4-alpha.40","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.40","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"48bff430bc9422054e17173d83923bc57126394a","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.40.tgz","fileCount":30,"integrity":"sha512-DTQyKOu3gGBgHOBr497OLOvqxbeY06TdtoN7Iv2UQh7DsATtpDbpwcEZfmjIFPA4JXSmyGxnx/6Wnk+cOV/muw==","signatures":[{"sig":"MEUCIGw70AhCDkuedjTT1aalxQzIUpubLZscXYeN8DBLQ7vKAiEAkRisz5zXOmXIzxUlXefXVrKavyDXHPuvGtbN3rqvMx8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh6BC6CRA9TVsSAnZWagAAs0MP/jmNYxuUO0W5GoG5M2m4\nWFqGzyQgjU6RTrw+679bVtwxM3cKOuIjostoTBl3zLYnxCCCbSzSs8VelmEr\nbolfxf3bKU+RWmgswsiSn/ObyP2AXDnMrEj+7ica2CMQZbnk8TRUTU/IyP46\npnB8gDUvhjx8+btGUsCNZz3d6f4mx+m33IzRs+3htoNWVJEvnD4mNQgXIu58\n0DC/7TkM/6txMZ6rTORPymN9AgS62PgjTKmiS+zE6nprKldY7KRSFm4TGv37\n3dpKS5PY5PN+nM/22Z1MtTlg/1MYly6sS8a/PS1AHkgROzgj4wSyIpfHi7yY\nXhFRQrmdf4c19sgVJMuDWMe1jJpBgEyPbua/OgfYmpxxhViYtqsXwvYWx5uf\n+zWZZk57IDKLsIpwfEZNyUqWyxIgTE7SIB6gzLyYZud/QoiUirfK48Dtra18\nwW6NoLmyDppELoClWXnkQgi2p7lA1zOGMBhFAvJ+sUP0nZbMwhE1DCoKGfR1\nJccn6I68x+NXxeM2tavix7Kbh4qfE6Pd9LJCfnv/A/VAEkYAIbvZOVh6fne+\ndmkJMp283i9HZAlRsV8W+UoGlZxqr0P0k6/gHum3edDUqBo1DFoSxuA+ojH6\nuV6cfVmgZBA6kR0ARraqSnMBPj4Anr4RMuV9N10TFruRioukQkoamYiw4zs9\nrbUx\r\n=6/Y+\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"b34375eb9a2ece111eb1e46a6a6a9446c1521e95","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.40_1642598585968_0.07133102331794117","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.42":{"name":"next-slicezone","version":"0.1.4-alpha.42","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.42","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"959291a2df67a6d2640fd6fc8820b3403d87c729","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.42.tgz","fileCount":30,"integrity":"sha512-o6fdSf/zSNxd6c6Bjo3ZkhLL4aEX8shZoczLQjwgA5wwzOSVxPKHvdtZYJjSx8c+ycMTFxslkmHA7hDrUMay1Q==","signatures":[{"sig":"MEUCIQC0FoOmKqjWI5Ln476w3kdFGXFH8VOQ1WvFnUg1YWnnBgIgR7uJiDw62GyoDWXJeSY1SXQK3ky+KNY/Rpu7qL6C82U=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh6EqJCRA9TVsSAnZWagAA734QAJpJGlCsD/TM0GpFg691\n4OiJ0vzpsjJJBF1FpYq8M599taigy4i0bAt5qnaS/vrfolu8YtLWYXyOHs/8\nVjdrC2FZgrgKrdoBn+Y3Y3HundpvomBtVVq5iLi6fdKq7IgYWfwmnmEbOorI\n5EUL9Ey7ociVhiYUyqjyaCqNKxYFDVexYvyfzBWLPzYo6fSH7AuuZ6fSHdLz\nlX1Yn5qg57WWnEOj8KOKCliS6N9j3bxMig7zjtJjn76e8Xoi3rOPNL6M8tNP\nrjHmEz1A4ahK921OzcF+Gfh/d+xJ2fiJd7y6bOJCstM6W/MCJjyurmv8eSTo\nAeDcrLjCxtoS6aRPuuS0QYuPKddh36aRAh4CSkUfS5FUC+YG/WadJZDyJ707\n3EPPml7K9EbfbZe8wPD6BN9mzkcAO4GLa05XiNTdaZsoFLgQwjrQOWX0A13E\nuc4eMIb+Xk/F1U8Ic3oeejgNrh0z6QCFMsodxCPJuP3d9yrorb4LDp29qcFu\nJMWnBMvRDNnuP0NyWQIf1KyKRp1V9G6Y0OTepI2nyzeGbPwamJKj9bmKVNyd\nijvfHA3pfecmiu8hT+vrPQ8lNIhrJuqwU7OjfYegk34mLi8R7W/OVzveTjc8\n/WjKnyDiWh1tkwhM2naZioPbOgIG2hWFhbbXurNdkjo/QXKCzwERXOEOJ/A6\nq6uU\r\n=viCD\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"f35845bab45f939fc84dde683c6422b5df86d912","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.42_1642613385541_0.7587190790252485","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.43":{"name":"next-slicezone","version":"0.1.4-alpha.43","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.43","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"b2e8656d351507a582d67e29f5c30055c431486a","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.43.tgz","fileCount":30,"integrity":"sha512-dNz8s28dS7IxJ3mleJBi0LooyET4rsol4wSzLdp6eJQPpKj4hWtdWzUFwcbP2caScEtFItpTyH6xsZa2mKiGqg==","signatures":[{"sig":"MEUCIQCv6Bzg+SrAUe93s4vTTpUXc5GmBvLPq7eKkBndurd5zgIgOlGd5N+kjvt+8eymPbuweMYUXszOJeYHEPFB7zDN8vc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh6S2uCRA9TVsSAnZWagAAyWoP/2EEJPY9eyDFxKPLpfeK\n0zvmnOoFXwswLQeBzCz4xHgz6QTSC2o95vo/zxrp3IIHQ/r45S48ItqOc0YJ\nPwd5KG5dbsOfNhO7HSD6z2CFuJUXCCB9aUCWN5mY6NDZ9vfn40dm0Olb66B2\nBbLuzXlaHBZvaS0M7oO1CkCwvXs5ezr5676C6y7asc0dsyQRIEHwZu1AjNOq\nX6dwXBMIe3UPJFCitRZk8K2w7ScC3Or2m9bAAXhdmEl71iHI7kuwiHZdD2x2\nOHNdxefqQj/y0j1MHdR5eQ4D4PXuY+p2OX1n/4O3DL56h5RwtNNEW+uwxO+X\n/lB6u76tm6jRnSRhE19qEZoI0nDbGMoUhaeKgM30UumOm2gOY8BUFqjpezVa\nFp0Y0BKAgVhEtDaFxjVrlthKZCIqXEi8yfdQr10K+jD6oy0wkRt71wJFpjuw\nswRM3TPq4gEi86XKTAaQBiGtBkg5eRnRsHeeMLZ2iwnposJm0WTfl2pQ/SzR\nKSLG1BleFzcbv2XDp1aTwB4GcVNf4QMU5TxyjHz8YkTpW68aSV+f9Z/xawxp\nvJtCBwAHgbG6+EQlZ+jyy7Zl3rvO3mR+XYuoEqg4k5hNmaa2q8asjVRenCMx\nvfO/KKcnzlqOhK3x/TOhS9YZZtgaeQ5YZwQz0Gv4vKeP/uMOOiDz1V6zI7Cg\nUuHG\r\n=FAQt\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"b44ce95b161c64b1b9d17e160aa242fe93042ba2","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.43_1642671533955_0.10114383351591849","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.44":{"name":"next-slicezone","version":"0.1.4-alpha.44","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.44","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"1e6a94fc8092fda66628e6c91ea7bb9d93f062f5","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.44.tgz","fileCount":30,"integrity":"sha512-62l3QICKuuBGZnhN6ettfb1opRXoKijjEn9B3VxMoDGfaCXg3fCs0VwRihWvok1uZa3gHsvAplQ9dMBKl3gsBw==","signatures":[{"sig":"MEUCIEVFLQg+bQLJr0LwRNSIPZz4opZByMAf6+HySSdTno7WAiEA8ZDGUje+N2JvbL6K116sXj7SdR14A1mq4AV1P/xSwGU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh6TjNCRA9TVsSAnZWagAA5csP/ijGRAQLQL2jlofLAhsp\np1AKeJQdXrYXKYFGGCLDCcDB0STrMju8bVIVDMV82pRG2bs+HLFDODqlGgEN\n9IkvDUQ2SGlPk2NSKwSxhKNU8BXOTb/aSuGavvB6Un6mxGmMzN/NewFZkCfo\npT/rtZgXGKKZ2bKPX+ruWJqU3TV6Xn4oqf4063o023sfRXvfRzaFweUIKD4K\nBoYiKysjs02mYLr206am2dMFYdMJgflwmKFIXTy+fTOpxbKG49gEja2yZgTx\nj8yyfkBkhIbYKyoPw8zpzcgxIuFawxuZyy7cVWjNxUUM9ohnTI5e6vzoc9Xo\npHU92bI8kcj59mlLIaVxEjz8cQmrQCGpkUjX1PANACC3tRvaVISMDA9MgmUa\nMbC23vDTqzh9BPjbbsYz82dxmo5y7+5sJ6onRQ2QPTNEIfy8OFPvV3h0ntON\nYGxzqY91sDlBcNZwTQibhGHwxtAlmFZoU54LKJuLnkf3AYHCJ226erSyv3VU\nvnccjfNsyFc1mQhRCKPXrPuXJrtvxH/kpXVu/LKnHJ8wyQhIQd41E93zAg5q\nEOd9s8cgzpVDjjJrGXUwdrExTqh4uPZ8CQ8GrzvKuzwHGulp3yRZh8mFOrEK\nLNdkSbeqmQ4HXOPuGHYl3uEvRLynjYemDTEDwsiMjENdPNyuZMlF3j1p9lST\n6hjN\r\n=b0sd\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"17a73ae5e18d51ebdbd7980bed67dad93dcec95b","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.44_1642674381033_0.3381082307792158","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.45":{"name":"next-slicezone","version":"0.1.4-alpha.45","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.45","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"b369b4352dbee6be3d2d44f7edfb45ea8a0ea2f6","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.45.tgz","fileCount":30,"integrity":"sha512-rAZK/UqwoyguO0nzyV271i4S7maGh/mtTikONStopeWqAr8kmOrevfDDib49b4R2jbJ5IqUyeq/W3piYIhPXcA==","signatures":[{"sig":"MEQCIGHtJvrXw4lmgI3NXCzfiDuQy25cB1aZY4p75XvTSLARAiADiO7USePYRQ0kinu9P95w45GrhlyyftSEVsnXkiX+xQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh6UOhCRA9TVsSAnZWagAAq24P/3coWXyBXnEj+UZr7g7N\nXTmW3DO45T1zNz6LEFoPd4XXOPju3i+xA1RF6o5u8ooaZJPTx2V2y77qQAr7\ny/MDg32eZUHaLQX+83f9LmLXAYsm3IS+jqxVLrf6+r/M7Fw73FP6t199VU+Z\nadX4mQZ9GvrQoB7EZrOHYbVDww8zP/NU6YgcC3tTlr70jNow9ce+qfekyRKm\ncry6pBexys15bZggBvGEaTJ8JRiaRoM2mCaWH8RT7oSr2elsIGDBjikNCWTL\n/EBq+j5M3pNSni8bYjs8mcgSvH9fDbr78wKSnKBuMrsI/6UUGStfjutM+5fX\nStLC7P5h3fnQ5dDZZLVv0Thy4XKISCwfoJCEQkkH2UIsXx5VQ62HFz6GVpSm\n+2YL/Rn/SQnZG6WvefixVFcbYskN8vxq8LBgh3b3qIm8/kMQ51764eHqlwO0\nYd8zgZX7jApv7EMxCx+SSv2tzuCnKRx2VQTaNj6UbukwIXvTGSEWeqfuEp6X\nNnQMSzBUkeigAkoUwSw54/AUXbtSKzbu6ocxS+w6WmZB5gvj1THtzK/zR5Wr\nAS7+7H8CaGH3H599loYfko7hU/HmTpf7G2lGt593wvuT1D/pN8y8zbeh7g5F\nudDvrZZefKIztBkmy+M6RZVwr6/0kMT4rtrbE0rh6dLXSDNKz0Mq5DLy0Aes\nGSSQ\r\n=q79c\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"bc3ee392fe085c578b1d10e0a1e69f7b5e1e25d2","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.45_1642677152836_0.3394628882761499","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.46":{"name":"next-slicezone","version":"0.1.4-alpha.46","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.46","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"8c7b8a52915589cd5cdd3831e0198a9f763af66d","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.46.tgz","fileCount":30,"integrity":"sha512-tHmRrniu2hS35rHx/xqAcK29BPxEEs1OpgkeJhcy1owsnB2gHvSPpppWAFvnHdy7Uym0weEpprI5NN2cL13vqw==","signatures":[{"sig":"MEYCIQDqoTRldSU8RO0Kb1ejPaKCk2xOPaPODViDS5R6WIa+4QIhAJ5hWkTXBOppa9Y5KKyCEYwaADtVBqxFhyAAXznrpJOX","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh6Wm8CRA9TVsSAnZWagAAMAwQAI9LabGj5zsD8fpSxqPf\nZlg4r0bstQ4IhQjRA2wEy6BtlbJuUp3wCjxQ5sYABc0zsVlIFQCasxAS/kFb\nf+u7EylqUtIii6rJY2JXCrC25nqGdzbI023NzwoyD8I4gggz9v95x0CuXd71\n6R9NP/0WTCjM3OP7rEX/XPR91MHZs03A0aq5XtmXJMgC3UGBU6oig12nJzjE\n2L4P9uIkTER8VNY6qfonahzsqHz+ONmVJS+TX5sAcmTTRL5FLhPbS2jio91E\nVs2nOZUHW+1BkwKHjE/vEmBV01DWaYMT46hhT9XPLC62HtwSBEki7ibmZMhJ\nQ1RkS2mdxU51PhkQHUigPnuQ2Ha2OTd+mx1saUPx8NlPz47Exn8LyUWRSvyn\n2l2Yi7SDJJhwn1qIwjduJOsUTQwMPFy5vKphe8+mF347tBe4ew5PGDTvLryr\nKQqUQ3cS6h7IbYWRBo1aCXUq1g9HGbl1rOdnECGuTIap1s4mB7t7nHeztsNY\n5CIAWCUZREDmbJvXcytjOHTjQLhhzKKNW7R8sGO9l3G4fXEUlgOb4gRGY8TK\nwBgQo7aXm7YZ7j9Y16H7IJZemtfPv6m7JH4I9sY/zPFcoEALHe/A/AEtl6A7\naBbYkeE7BOXqVXQ/v3TJXNbECdHE7kjCIn3M4iJrx1K3cZALutG8NG+i+me5\nRrLL\r\n=7evN\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"a4314efa6e4e50e64174b808bc6b08b229a507c7","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.46_1642686908635_0.48745333896401344","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.47":{"name":"next-slicezone","version":"0.1.4-alpha.47","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.47","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"4179b0bcfb50db7178848fe7b77962fbec8d6094","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.47.tgz","fileCount":30,"integrity":"sha512-vPNKqcC322pbsfZ3wWHmmJTIP0eeYrN4DvAkz2ebabGF68oBoza8od+zpOK2GiIS5+RGAIL30jRfU9nRckbLIQ==","signatures":[{"sig":"MEUCIQC6LJNC8iOrDI8ocBFQSpIDtGMIwJTHMQBF5pMOUv+G8wIgS7PckIS2dXoURDEGl73vpWB8eAsXYsAm/QCvj/IVklw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh6XcJCRA9TVsSAnZWagAAt/kQAIylhEovK0rvG3vKXQug\nuzxzj+GwSjuweWW8BB/SKQwABe6IgnU/o0pBvr9DW63atuQyQ7XK6Wt6t0GE\nZW0d0h1fWSreYSYzauJo8x3bQsocOC9V8teW7Yu656jyUg8CGhthSdbHHGM5\nEPeRk4kPrQEvoHM+xXAa3Xju8bbOv88uDnfaV0O0Zz3IYcwlLnbPVbbqKAqr\n3A5nVU2jkKmJ4C/GJVnet7oR6AbU0WWmmt/uKmND2CxQTtvwehG1w5IcFOp/\nY/HUrXOoVaYDXLafTZStSqgyrb1xka2XkeWr5tphFkeiomAZ6vL1/UHSwHv+\nmC8KYOhSRa0hVkTk3MzXC1eY9QXXFM0Cji0XYPqbMx1yCuceu+Qagg2PqGDc\nuhQI3lwVtwd2tKoYBMZY8ZHdJtY12G06iGOuihFPHwfUXjjSJbzs32tmXpzC\n0VjX9sLFoR3TCKwR6yrZjqfK4skqOQRg6WWsv09mmd9lR2VEjfeIdvVsi6Ku\ntc4TTQyZJh+n783ndvtj9SZLa3tdDqCg+nOAkEZb8BuoBu6X6gI8iZFxhhhT\nnzo0IB/gBuNtVfw3CD4YciL0+x8VJtAjbx/3NEiY7dzGIbqGwAfKmiQL+ko+\n3o70anzOxEH715UENh9/OXCJuo0/ij/K2Ox7j/PiDP9SLVRyFB8qo4/iFbSv\n5UWl\r\n=kIWl\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"d2d3eaea6c98e0e1db0b9bbf8574b121c40b25cd","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.47_1642690313743_0.024111979369470404","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.48":{"name":"next-slicezone","version":"0.1.4-alpha.48","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.48","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"233a7cfcf0a4d64a887874c7d673894cb468d5f0","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.48.tgz","fileCount":30,"integrity":"sha512-U5We7MLBdFcwFydnH4PLkTDrO8HQiDbZIxBJSbeta4k28oob+A/aYXO2ARTVObTN08NfTVu2HpsOjcNJO71bhA==","signatures":[{"sig":"MEUCIQDxy0iqvDnqom1NVFr52rQpS21KvVjI54nCo1y4WE8jTAIgSsEr/hYuwZW2uFoWxrSeFDrtFmZ6KjJaZAKWb2/Ywig=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh7m10CRA9TVsSAnZWagAAgngP/jCJ33B6TdlypYqBodVR\nRUAVC0GR1edcg+I3S9oFYTM/O1kmZG+yKHZezsfm0YzYC37oeqZxAP127/XT\nQ8FvHbt8is/9NFDCz8ZUsYnrrTkOcH2djQeMiS8kNxwWREjTzUN6KWySHNrj\nKDDSyUHuKWuYi+3aTJm/jOFNjc5HnDidOknFmnEAvD8PCHAEonGV3AF/9bMb\nagFjAbap1mf1bhYU3wDJtCfUOKEMemltxF68PrU//Sys0xkFMpwPTtdqPd6B\nXhOeYNvpplXn55kj8vkzqBGePXoRzGNCuoGnEw5hDBpQa6OhSW9HtqaJhb0L\n1AWVi+9knU8dga6Sb/kcb1Q2YkkZAqDxEVtg9PuaNLtvNAlVQATXQxgb4tND\nnYkfCqtI9P17DDBzolbncNxJLS4qoLL/d7YNy7vIcArmOERPFEo0/nvFMEMj\n7BsIV2/ge1ZAPVaa2tlIdM2me4yzwCRu1ogZ1L3C4YXkQqUV3zZvsGnHbqqQ\nDr6ZAZU06S2EIkp/tQOWTYlp9+KQ/X3g6A8t2dXE70pqKwPqJ05bk6WLcQwc\n5fz7r9xqWyrXERtoQFipswIaunXvYaVWmfTV5kexFSRApbeomJlCsCK5H3fY\nARrorh8ZIxyDJ6OBiovrsL+8wgajUuT5w2IsNmY9FbsMlVI9KvqwNVqLe/UK\nTjCy\r\n=f3oY\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"c28b11ce0669eaacfe874db8bfd3e64ee92854d6","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.48_1643015540844_0.8486318032690068","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.49":{"name":"next-slicezone","version":"0.1.4-alpha.49","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.49","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"88585185cbef8d7340a5323c51585e903afe458c","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.49.tgz","fileCount":30,"integrity":"sha512-tMquhb1lGEk0OwExU4o0zjDuG2OK+9lui1JWqbPbSMpN4m3KhSFQZko6G2i5zdRP2ThyjsEhspLleWTnw3ICsg==","signatures":[{"sig":"MEYCIQCrvoKMqVisarv5Pf8kNVgs5ptXO2YW4VLptpsXTa8IEgIhAL2bbBAiQiPbq9XIeUvQ0MsNmiOQz85d7rpgRcj4Xj96","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh7pH9CRA9TVsSAnZWagAAoc4P/3EXExIo4BezQoAa1jSp\nW5c15WDlcdTvBZSlJnPUk0Cm/y2C3Dhs+1mlaqgTi7LjsYpgZr08GCudJetX\nQbb5y+x7aPmsIg7B4b+Cmz4PIorI/ZwehCj9zyz8dwhf2ngY8Pfi4ZX9020N\nazIrRZu4d6PACf23w8RfVUR+I1Deeq6IFRnEjbVIJ9bVQySLAUo38Z3jMlZn\nXwHayxduHuoUzEtjl+9gsuppof8eewvLQaqYhcN8Qfuuv3sWUVrWFQCGKHuR\n4v1txwKeb4wJ7BRtOjPimvJz4nQ1k6KpDE0BwGwSqm2AbAmGEH34zSDVNxrn\nYE1+Dql/+Pexv75EdSGEQZhkx7SQtT7kIzLM3rAplEWab0uAqes636yv4fCM\nPBG5/dJW7OKot40HlPv+9NCY4rnmd27Iby755a2jiToHeV3/WZdwGPQza6zF\nuVe5z/oHCXv62oPE8pcd9tzT5cj36RyRaH8bWu5wkrcI9rFSBVt7T5FUqEHH\n5B8cDrHxi/MzBBv00nWcpi0DCA982IyGC5lc4N79MCe3z55Uo5bVCPeGhm+o\nlJPQokZBMye9x0XVG2KF4rbL4izZ5pi12ajIZlMJEhogkf61URYlNIWLXsYz\nUgBX0p75OZHL7SY3vNkhvf391yYf2M6RK0d+ENqZD+4vzOBux4tPJA+BStUN\nbbFH\r\n=LIjI\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"f4c989eec27ec3f5f6181c2df4d8701b158ca236","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.49_1643024893271_0.24852010772923094","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.50":{"name":"next-slicezone","version":"0.1.4-alpha.50","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.50","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"27c6164991b1ca6d25618cde8f275696a5ecdafc","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.50.tgz","fileCount":30,"integrity":"sha512-XwTDLthwgZmmPx5SxeotGN6d6EXGTj0AFNB9gS6leAOVcVm2jfWnbH04TmGoefNHraljexcYNby9u9+n3w4h8Q==","signatures":[{"sig":"MEUCIQCn+cex43euhDSQTv9MAecIAnEMKfRunQsvA56QdyYRzAIgOQdufJw5iMM/wRfMb3UBo9irINVnWJKyKgfNXZdZH+E=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh7rz6CRA9TVsSAnZWagAARoIP/iA/G2D9PNkklPYfgsUm\nKlTKTernRyKOoo/CUD7QBswkhOGsif1ouhuSO4sSsQcKKSoqdRGMdQVYb7Xg\nvX7QHdW7cuCuU62yydpRRC8ce4QnpbSGNU0s9lzj4T9kTl0tJ/Z/NS5iYEm8\nFiKV6I1bnIdVR2eFaDtqbAhQgLFRDXWpNyB6/9BPvLnZErVxeRFUH9PKMVOr\n0tEoANqpZcEZ6l9Fm0PmNst6CwD5PKdMIuKfb2pvwH5tyJMcMoy6p6s9z5Eu\ndhYJupYnuPgY/4+AFs976nESJctbQPhRLi4joztAG8xpryO2t009kyn31H18\nuT47uCZWLv/ybBiECqyz4+toLhmcIA5pozRS+etQKNYu3D1v0QiD0tC43YyG\nCmbDkPyq/slzeTKmOx82Sd59rMJNwSK6rVRWG8uHeGXCO+oUb4y56DudYUwY\nxc1YhFy9V9pom1hcI0bAojDSIIw5Qwhg8f//ADVJnowwIfZDS/1pTDnqSsW9\n2ecE9lZTeiAAqgY4pvyAOYjYmw+cnbBV7kjojxBRHDM1vWMz5ZFZL8lBa75t\ncl52ZgPd3+6jbKsGJJ66+Dvo06KE6L2wz4Ae34RTRwvGsrn1w4twn1R3AuVA\n/dB5U1DJgZmFZOspqZM1aCgECl3TCE9sQVyFw67g6VsU8pOcc7pYJGjDlbpu\ncx9y\r\n=NNWP\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"5302ca14f3bf41f3d7258ea477262daa2e79d637","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.50_1643035898579_0.8647216939489932","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.1.4-alpha.51":{"name":"next-slicezone","version":"0.1.4-alpha.51","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.1.4-alpha.51","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"13cc6e728bce30eea9a644ca0a4b6b4131d1a32f","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.1.4-alpha.51.tgz","fileCount":30,"integrity":"sha512-/5vTAExqlttjgbi9kHJw8fK9cNEuMaRTBxNMjlCrB6rSAhUYwcBgyn+967Xj4rQysTegIz0gPpj4AzSiSJoaoA==","signatures":[{"sig":"MEUCIQDHyGMXPNL4PNmXedF4BXDsXLYKQoUB/DgGBQTi7ychOwIgCuZb2MVzGhxN4K32doWeYlUtf68S3d+lCRYHhZl7M58=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh7sd0CRA9TVsSAnZWagAAj1UP/iqG3vdHGbf5RXz4Euu2\nCCEKWwip9onZLBMuVgn+liVIsVcBsGSwbYMqWWb/tFiILBQFBZPm5BrNeAHB\n6YTbCRBJkb4FO+JU1kZ/Ve5f0XSv5fB0AEdGsTGZJJqSNkW/rOlrUW09Zo3Z\nVO7EuEU8dmvTaF/LTSkwD/KmTFuayP0m2Led5nLlyzL+DK1MdKpA8Cfnz50C\nkoTS3c2KwQWylTYbckOWhyhVK7UHykOTxYV6oJjDc75tYJd7gXQcFYyISOXz\nbzc9LIVuwIEjNOvfo0IpSdO1i8TSq8I+vN/peuaaScvxBbHTYnaHctp37sgU\nbigg+5XnoeiFgXhYV493/5COKgeG1iFIFs0jysy2ISjDaTSNXIyMgZj3l+nS\nZxjpcnjUO+vfFxcHJHise0IVPRdQPnwnNVGhQh3fA3KawKpSAZJluveKZ6oq\nPSv1j23qMc2RvGI5M+HPIfBynEF7+2cvzTiWnYD36NrNfrlnT7R4oe9yhJCN\niGvDiMXi1mQgemR1AghbblW3VpzLnCy8aFXKK8/Bytg6iPMqBDlBo7YiGqCW\n/8ReWx0xLlbt/Ei7M++/KSr9g4aV8dEKV7v13in9D3veLrfjBGiHnk5S1r2v\nDMJ3deagSOn87CYa3i3Tgqs1fO8t67OvSR7zwo3eVdUKXp7OO7iguPYLjxzj\nsvRM\r\n=zAz/\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"38525efeb8559fc47e404c6c20e03a96adf0373c","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.1.4-alpha.51_1643038580471_0.43707685138757024","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.0":{"name":"next-slicezone","version":"0.2.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.0","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"b5cc8aa1318861d8b865176f4f73064a44334274","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.0.tgz","fileCount":30,"integrity":"sha512-+m/gtUi59uoxc2BBqsVDA0Cwl+f7vvj4BnYCbWF9/rDmJgSUr4yuFOb6+Ux9VvBlDstDKpxGUbTAUzPpnjrp+w==","signatures":[{"sig":"MEUCIQDYmqQ+aEC2YWTSp09X45VKdy5NADONKY39WrxCyBZJVwIgHnTInEkl7NP72Ls3lg3Ra3SCHqP78lyoPrAwlvOYINE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82879,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh8AbKCRA9TVsSAnZWagAA1c4P/imwKoROFkscSdj8gP/O\nNjYPlic3UkZFZUuaKkEajh/YQ4ySG7gDIm1Y2a9CwfZfsDNo22snPl6GPlK0\negM0lphtFUYUZVOMtyfHEG2g6rPGpaeG4/1hNp0XCC7PB5CbnZAaZuxwBkep\nZN7XVqeJHxPmPrYbQofYfrz7DimwP+IbeiV7VXIFJSThjlekRTNdsyh9I7dn\n/tCV7zeBdgIgQulJoViC3f2qZf+o+CruqFrS0fpN2HX7HSIGGmXB5HFz5Poy\n17qKE7eQDdGznSAwq0Yb2rrL2nUhC0bq3ppXV+bpJF0DjNgX3xwuYAFIKbIX\naIz7elbR1vXxOCZ6+D1C3JJQlclEUNaCnq2fCMJ+1AhuGK550EHby9uXBKWr\nXttTbQ9Xu3YrK1gSyGjm4twlmEAssJaqY28Z7NJyq3vG/MMxO/YqL4z+1bO+\npqRvnUYzlFx6/gi6e0I/Y9tmyt26qEbH2JIWesMHJOym8LIuL5uzKR5GmeKb\nwL1mzeSxuJkwO9mQbwUELC2sKKHboJ0oSZFPhEk58lqh/DfhCdFVknDWSps3\nUgMwdUwgvSgVRTesvZXRY/bZW+nMEK5o9IvUNbNpQ0iRKGNkXj67ybc2wU8X\nBAC5LpslCw4wgK8F1pBj6Va30gI11qnZuvhA0WmBuOdIVaa/aJUudhXy94Qy\nMwlr\r\n=dd8u\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","source":"src/index.js","gitHead":"97b295194d61fd466f82ccc960819289a3482ba6","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v17.3.0+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"17.3.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.0_1643120329927_0.46821310768083646","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.0":{"name":"next-slicezone","version":"0.2.1-alpha.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.0","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"231f835187893d6ca3f65c185a1ca84d9cacbfa8","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.0.tgz","fileCount":30,"integrity":"sha512-9/zpUiaBXaZOSpw/A/b1Uqj4Zg1PC7W5h4+LBZWo0TD59VfMpiw+mooCLlwK2gdCLWBRxlUp6uK9TEjxwQkb3w==","signatures":[{"sig":"MEUCIQCdB/i9s6es2YQXVmAasQpNvpmYMGmiXL1ILfquSPpHRQIgDEBhvJJXVtn8/mm4fdfw6LfukP/8wPobetI6GH1684k=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh8pJJCRA9TVsSAnZWagAAIfcP/jy3U4NEOzvCI0vp31OL\ndpsoOSXD8pQ5kV3Nalgv6QaOmUdLWAZR5ZzjwaHAhHyKhFF6kfTLjF+7pUr3\nY6U0xEZ7wxAYiFzx1bTHO0I5DH2CcoEKzTGLmlSxw97isAYcWTAOT1afriXk\ndAJ4kqcdpywVEqnSNTzchxDjpafJkBP2YXlYHU9PIcNCVzehwblst6X3WEnM\nrfaxAkGfsaBTHU4opyEc3EgAH24rX5Alq9dW4wHbLxyPYGfxs35ypaE8fCII\n0cdRGPsjWzBeCcYKIJV9szCPW4XZAynuQ/xHjnjeC4dSzttCtlyTIn5G5zhP\naiuFOAcbdOchljjV7/mY0ASO3qvEnPBYmSr7ePdAGElulc9tL0lqqXMTULJj\nt4/s9PzTUvxnR7Jpn3HyKmBUZsWcyBk9DSyZ5xcX9vdD7YK1FyQkBJIc4YNo\ne+FxSaOmYXAAmty91APue4KI5pvEh3C3jeahx3GP7YkawDTa6F7NQkNh/Tts\nfLdr+xBdf5wTs6b8TUx0CXjfJhGWcww4z8L3kuESiP2WX3Yvxa6uQEAKy2bD\nCPS3QDXzPRLfMXWanVITif4+ZutcrPdgOUhQMSqR1fjeR79kR6Ot4/dtXTiV\nvBZ6YPuOz7J4Z9wsxHBjkiLapdu2PtbwsZxnbonK8Urp1MvBuXZQv/xgQk7M\nXvXc\r\n=X6vp\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"3af3a572c74ccf33440f9148ca611f1d7c1b409a","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.0_1643287113488_0.8309392436138323","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.1":{"name":"next-slicezone","version":"0.2.1-alpha.1","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.1","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"70dd3b5fcbb856ed28badb57c591fef96955db38","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.1.tgz","fileCount":30,"integrity":"sha512-4G7mikITgIzje8da/O8himT2zGKv5LzbAhu/cemACV27hTuk1/q1rVVq+onsQuON/A/Jy8Td6TLhwYW/l2HzsA==","signatures":[{"sig":"MEUCIFc58scS42tApgXIxL4yRY+yJW8h6XByrkELHMKZ3UbMAiEAmepW0VypCzypARZ8XFtLVc4e3S4OWIcCILN8OUzKG0k=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh8tSnCRA9TVsSAnZWagAA5OEQAJZgD0F8nYaLVl2Po63O\nb0HEj5cI7z4qeHM0Se6o1fnZTTr81K7tu+QxRcgacSJ0alqU0wzlKa2RtoAH\n7cVsmTmmKDinJocF5lwc9sSUlFVwDbZhIphFbYW3oRAt9WVWXDWSYKn4IvVx\n2MYwYd4+5JMS6O2mkF23XNvpLRze8gizbV+YDsNJJpORDOxs/5EDOY9l4RHQ\nTsIQFbATLMPQUVedzVb/gjTJL5M5w38P+kjotZO7RKwOXBJbmWuKeRUsLWjy\ncsCf1qDGXyYIozuhcEp8bNxxcPFIHm2DOVkx+Vv82koeG6dRvpebapenL2V7\nD11XoJSLKoEv6e4E1m20gReIEyEVBIvjKJVdyYf5/Ia+T0zM3y3ZAweJPb/I\nhnBgn0mmgjay2sarwfBVQJXRqkbA4h+YdmcvNjk2aWelIgkrr/zMRRe2c4kU\nUfSvq3k5oL041k/5eE9TMKDl+kQqZGJH1ctDyMR+olqbib1gGiB+ELDGlZsi\nYhK7Ht5gd3hGSlJC0H7zHrTWkVFMe7iJuyQSVffgUh17WS/LrRgyCyn2Gr7b\nh63AhuJW/CfNDDcJk+brHyTiUNeiqZGPfDUaWKui11orKNX2lSx2WaKqw+cJ\n4BaGzGuZqMKm2aEah8U+dev75QLrYTi16S8GxTv66AoRitQcXoIj4bShOaK4\nvKL+\r\n=Ybjo\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"e31627fa95073c03b58d2d7f8cac27299f18981f","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v17.3.0+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"17.3.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.1_1643304103715_0.5073418838418489","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.2":{"name":"next-slicezone","version":"0.2.1-alpha.2","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.2","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"494c1084c868e4e8b6c5c36d6f6e0b9115fb5155","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.2.tgz","fileCount":30,"integrity":"sha512-zTU3a2f+nakjlSsc3c/d/x5poVqZ172b3hOv2yAWJtZw33LVr7C/+cM0ibNNOlJUpVyEzNhzNErik6X5MZNMMQ==","signatures":[{"sig":"MEUCIQCJjEZ6sPyFK0zoARyYmjstxcF0DTbiUvZMZ70fx9a6UAIgGMXHJ5vclFF/KuvGz/9gLEwqZ1NAjiCgAYNGQPuyNhI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh8uMfCRA9TVsSAnZWagAA+nwQAIZyCWgyg97V9q5td3S8\nKPMdI6sXzr8dPC0hlsSyeiYQrWkhl7THAI3lDC8YTth47MXGol8f93foVK9+\nFuXk57w35haaUEJcufG7DMiA5Hlg+P9Z+2NxoBKrgsCt2bjydsSBEYIOWCvW\n1LJeP94zpMFGSEj+HgkxFNRQ/+as3FkZgJt93tATGCuNUI1jmnRjfO8mENMX\nnXvT87/6K9JAlljm+XxV2U17uXrR0CVeQGxVlnCsTT9vgyfqA8DZjWSVMtom\nPy9D85uk658GdegwagmVzTK51Tk611JiVQctlsu97uTv2f6T/rwx/KNl9MIQ\nW1gqllSPn12Mmqgq5hYx18etzSzPGP9CjQEB9vjvjzmyds7+zM3bX/wQGI5A\nG8uULtvWEFsQgXEh6oPMlomXWDsA8woWzDtsl0rQlEhWPMCaoT7QA/LceQ+w\nRVi5fbMa6b+s19oolQ5M5pOFuXU10Xax8YZNmzB5TRrzmdDXSsH2xJ6YN4tr\n9k0HOGVVprqspSwLdgziyEjhW9463VwNme7gkAJQqVOA7FIZqjGRQn36hExH\nvh6WSvH5VcsOKET0Qpr5p0SSJnbKHe/3FEVaOstG0Zas7vcp/QMArfwcOnMu\nXBelZ8rj3jOA7umrmWEebS9j3CIMO/qit+1E6/fsty1EXljD8UwcRfezPSDn\njHP7\r\n=YDyd\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"44982775c09a3918e73c3f6513cda8a17573f07b","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.2_1643307807192_0.52275432770691","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.3":{"name":"next-slicezone","version":"0.2.1-alpha.3","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.3","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"f9b286b739f73d4764e00a7c3a59e9f6ef6ecfde","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.3.tgz","fileCount":30,"integrity":"sha512-oyOcDtm+AsYcO+ooMKGfxfCIxQtdSq86Pai7lbyseXZS4nZGQ3pknrRES2Og7PSv2oquha/db70Tu6Jvy6XDzQ==","signatures":[{"sig":"MEYCIQCe6u/SR3iSzN5vrGzoT7UG/AWEHD9XJm4eTWXpuf7m3gIhAJ2/AJamCRffIhW/te+/Ay3VMy54cW6dI8C8xhX3nCMX","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh874wCRA9TVsSAnZWagAAgLcP/0+TTLISqn4qof063YF4\nCc6M4fb7wyXiQII9WDNn3MVg8d0q3v97fZTMmuB8nObV39l9X1gv4+Nl6t7p\nHkXnAPAaUsIhtv52X/0vpsi8ePmtU90+qdzBsYDb4Tj+ZKDCpLyGhLED9HLt\nvQo2wEu0+spsqGG7vp6imUCqBmu9fMsNH8v/q9uIrCmZbv/C72n0I5ScQ07m\nkeRsgN1sOkDXWhZ3w3nle7xmW09nZhvKCwA776QrNaUFnDlFBDG1ziZYv6p1\nhekB3RNXmJJJuH4Mr39TY0ejGlWbwgYtZUAZkrkcvUDK1gxCddKZ2o9kDljz\n8rcsWw6wIUqzcxVO1lV5W5SKWUcfRG1GpmPo5qcsHzhJB/rmJG2Z+S0yy4bE\n3VSfS2O//9r1wTYhz+spg7hzxaZktax0H7g7mbfkjCuOuSDKtMQaC5GUdAkp\nHOZHxXSONphw+BcDa7B+gocFuoARRdilEGrSxSku66C9XSGjZAnVmvJHNXGs\nO7jjyzT4bN5EzR1iTV6W+AuHXxGDfuTWa/OwXAtkbd5IFqnXbMk2NE2l+2w1\ngv/PcVi0cCIy3L6QIRzUs6hqyc+nY+LFDoEigAvi/xt5lye/yQVpoKSYjS1Q\nBFmDM6n/5+M2IRw+Ig94eZANGwOYWuAJK3GapMKN8yTvs9vqZPVMGTd6Zads\npUHY\r\n=/yfc\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"6d3a65c1e766c4e571bf3f051a82ee3ae69556b6","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.3_1643363888327_0.35453542202354327","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.4":{"name":"next-slicezone","version":"0.2.1-alpha.4","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.4","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"04484bbc2ae93bd7a1a1321ef9e5906146c779b4","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.4.tgz","fileCount":30,"integrity":"sha512-vGX0H9wwCcJfGO4BFUkajqAO66O95YHU3q0gYhmZq59ZF0gmKOjulh7zSkmJ0vkyLkE8itg/ALxm8rAGvE3tJA==","signatures":[{"sig":"MEYCIQDN38bT0LebDDVwiWb/4R24NWdvufdTk/aixBceLFOW3gIhALaDYiaOfc6IsQPs0Sy9IQT9K/qx+Ix5RnUIJrlWxvak","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh9FXGCRA9TVsSAnZWagAAFpUQAI7g4VjMsoBFMrXu35+Y\nOb66HLLmiynk35U+nJM7GNu9+YKlvUVaYF1jCWvA6iERMtwbMYvM2p/MBoLN\nX7vI1BfXIB/VPwDr1BWgWc6lHjf53dPmsMD/uJqAmHQTKrmvVva8JmjxHByR\nuDfQBQ2NC23xfzc2scjfH9EoqHdcyT3ioHdjDwiU84MUo4IdXju+1FEGI9Pv\nQo6fEp3NuroG8TP79YrsbuQRkcfM4HSorz9ves4YbJCB8IxuvFKYBXMNOaO4\nKPCEm1RmOSJk01ZXhLCFqmqxxTotAIJR9Aqqcf6PlCHZ9GlqKXmfvR+xKkyF\n7uLGHVPviAsCyDef7Es9b2EVZc5sMT+FAwYwSK5YL0DhtoavhXv/SxhlOd6S\nrRUD19yg8qaqzRlvcL0+GUJi+/zQDKF24p0fgPzVEOh4ZJpyxP5GOQ9Mkhtx\nbbF0Ci2S/6bLUrCf+isVBv04CR4sme9MQPcYG2wFElRLwAOG8+LLM2a2REDl\nkr5NadgCZfkyK4Jdgaf2rKiMBFMK5mSTPTvrY0UN9regmy1FZa85O0Hz1097\nSCoo89jH1mMfqsZHLy3ZzWpFlLBnmk+k7GLXTuGpPEFoKd26gnR8I3cvOa2z\nnNZ4PbAwZmNHDVeQkEN/8CMjyTUCb4xBsJWubCno2TB7e3Jm8GroAfquVeff\ncvEy\r\n=98r+\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"5e965450e722fe52bc67fdf5f173d525e68c2a70","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.4_1643402694416_0.9702845498472656","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.5":{"name":"next-slicezone","version":"0.2.1-alpha.5","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.5","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"e583d76d1c1125f6deca2a1c2f60d295c6456fe4","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.5.tgz","fileCount":30,"integrity":"sha512-T5hFdKaBIWb9bobk40JkiOCyD5mCKtGZ0p9rAoczIw7bbKfiPZ0PA0C0Agj0kWFRxI2U/YzB5kdeYtQ+w+Qzqg==","signatures":[{"sig":"MEUCIAwjqUsxbfYVy/cQ4OMGS3XMISx3ZshUsSuG5RcyvcG/AiEAyELPu8fID3z18HSnoyxcHTctCqhNCnUZJ05u7np4ZbE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh98rsCRA9TVsSAnZWagAA31sP/3kgQEqk+TCHHrfC/bDK\nua4gZGfF0L57+nIG6MzjenbFPDlGE8a1tWOLneJTtq2v4/amdmxydVhM2SsQ\n+bOuOwOwwNdrL6aFw83920+EULqQVGNfm9FS5xhaHfEZMzvl3uekJ/QfZh4A\nIE/iTTWCfGD59dIaeqAj5BB/eI/cm3OV6AMWrqcy3U6vw3iXprT9pX8gARsD\nF8E4EgTowQxzLGxM4fRojN1Ti8zRB1XWEC1a2D0zl3v9XFEeGN33eQ+8Pe7k\n5ao7U+fXyan+wtk1PniWRMve77UFHlj3y0a4PrCmG2fUoqhgXSgFpivoj21S\ndcqUJ8013kY9PmAaa7+9Sdroe0F0clTQyxn/wQW2cRQnSFEKd9G5PriiJd7Y\nDLY0ub2sH2REaF58aE+tt5YHMtz/uqLi9HxVV8ObwHC4i2SqGdJ9BzsR0qln\nAe+rueylgXYGp8ArP1MI3aTMvD1PCfPghKn1VmUjLkHgzNpnDHuRsQnNo1or\nkx2hNIb9BNb7HWe8FQYpSGgjmusIRgYchSOpyKL7kDFucQ48HGDKsGHpxgWl\ntQd+bbfjgWIZe4L7V+2967CgMOJs6xl7/RBS7+768syoK513OLuHL39I6Jfo\njyaiTvxX+eUAsJ9/K/7ELUilHe+fpBDfXxaec9Y06JA/Qk3Ib8c3zBDjBpVR\nZJgL\r\n=+RAX\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"144a2e6caea2e07b1336021f5d2444ffcc2703c5","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.5_1643629291991_0.49335478753200235","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.6":{"name":"next-slicezone","version":"0.2.1-alpha.6","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.6","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"49086786e0339bb75ec289b61b87e9e2acfbdf2e","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.6.tgz","fileCount":30,"integrity":"sha512-qX18XXeDko5mi/tjBJl43/yEtWqS9NKv21cLlouFdWFhbMOCo9+hNVsK0Jrp6P9QvjcZ/4JZ2Nh0EjRoyKt5rg==","signatures":[{"sig":"MEYCIQDRtKgN/aijqe+vpuYfN6wl+SVgY8H20pB0oxmwSpRi8QIhAI1SNg/zB8N6TS6BYGxKQtYfHrAFe8X9zukPlObzgJ3y","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh+C6cCRA9TVsSAnZWagAALzAP/18DlSD4x+kLunkVpAt0\nWPH3QN5sK+hdesTXFu2G9bYVNU1mC1Lssd9Fkkf8w5pmaPhQ2fM77ipTamAH\na9/WFU2HDMMOx3j+leUT3C67efnqvdrghyIk0baYgjYDaD/MNamu+xgycOoI\n7i9fFDzMOyDa/pDQg9k7TpB7tWGBDjp/wCxfPkakebd4xPG47cmz4pjt5RTS\nE0fnc97LhMvwwEeKPCwMO7AXsjjP+raxOGytbWeiiPIyAYXaFhREFQlxFdk4\nXkk+6qd9H3KNxOvFrqUuSlT3gscpjObPZ6BkzH2LX9XqfFVUwvZG1M1wKlBs\nAp6sN9W4W7ZY6eGzP7Irx42OcsmNmlLF88lCghLNwUnKjRuS5/seOLcG36jH\nxzOMXeT5aELsaLCkIMcLL1DiG75EO2JQH8yb53ZK/YSKl1bRj6l6O79Dt48Y\nUAoCjYpJpp+rwXVWyVQGFC85bOLC0pyaX6HKDneXQk0NTyh25/cHx3UVV9ZI\nloAWZml9p7SnNBJg6hNmHlub/9N7cCkJYa9iRzW9fRmkiN4TLplHpgPT6rwm\nmYjnVwR2MJJU6flo0JqP95R8I5hbaFyybPzfk2n6WY5CALjHb0mih8HRyfsU\n2My6aVymuoJGd6hfVsLlPGXJXlmQTsUlkDC4blhNhuvd0eSK2wyNa0Sp+qDL\nwgEY\r\n=twKS\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"3239daa4d983ac3873beffd43eb52d45a2f0c3e8","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.6_1643654812684_0.2462412796327882","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.7":{"name":"next-slicezone","version":"0.2.1-alpha.7","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.7","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"690726702e3ce98000defd585e60fc4a82d82be3","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.7.tgz","fileCount":30,"integrity":"sha512-fmnqzQ2QJKVNRdPzQHPs2uoGRjONr5GjBWRItfBr+9X65hVrXGU22jRedBdHd4yzVhcGQkJWD+axGGi8Szis8A==","signatures":[{"sig":"MEUCIQCRu/fTpIC+g8je6fDGRaWBqjkAAh3b8vNMSHG+Fo07SgIgKuGbsUs8nMd9Q/Atf/v2C8T3Exj2cNaqO2ieM9ktap0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh+QOzCRA9TVsSAnZWagAA3/UQAJSPoUH/j7n792RDvp0f\nZf0jtaoXsLZOf7n0qJs0SEwL1PTg6zFjSiSgrSdknArwejXgCbaboc/wtGKW\nk18PwxHhb88u5lTzDFFvjijRuNzHtMhE/TpTGF5MareZ3pRggUA0VFjktwtC\nZ0tkG5HyWP//Q/lVfSrQZJA0v1GbcLeKpEIBWZdl5OmHNQHIYI+j6G+B+/Nz\nhorabsVTVfCMvg5J7JMC7B+O4IgkONq6fpFIlk37UZ5KgcDtt9YyRze9gCgU\nO64AltvwhOSPUjV8l+pi6/cR7r5KncgYhWGuRCDqu4tG8eNUlSyAjc4bBzj1\nxLchvOY6lg8v/RLS/1yvWPKoIS9Ik4BpTFtFmr5VK2PwHWn0PZD0brJ76Kwu\nfhxhJviBQUK+qd6wtkE9Z3U2waZSb/nPpBmRvepb3tJWZLCZ2nyUbu4EN/CW\np5VgISjOhRXcNzjz6icxFVM6O29n+mB9sYP2qYqCNma7Keib+bHXkRyMSMCk\nsDU3DT9cLF60LAJiF7s8kNB1mPQG9wDwJtHSfxNgqQscUAVLhzNBWcc6HWQl\nI3hgo0in9r31iV+HT7tDoALyLK8xny3/H48viKeysmNR/Mto5Hy4Abl85v++\nZ0izbhrUTk5ei+Pd5TYh9yuXxzk6uCLZMJQvwblsMpmMdA7QDmKu+DIAn9+g\nfTVV\r\n=5xhv\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"c6e8aa8cdfd1824509cabe2b06742412a65845b7","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.7_1643709363095_0.5206830078298803","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.8":{"name":"next-slicezone","version":"0.2.1-alpha.8","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.8","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d487db2091d7445117dbc80f905e5a74170f953c","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.8.tgz","fileCount":30,"integrity":"sha512-rupvko1tRosxhs1TtZ3KTlsj9KqVtfc2k6s93M/6DSSFDBzkcDazbXvl1Ajm/xw6kfXFMD6DcDu4tQP6wx5obQ==","signatures":[{"sig":"MEQCIHMa1Grj/b8+uFgISQJiWHvovxFjlJiTi/mdidcxQ1aUAiBFY8Vl5JYylhAGQ+lzMSnSy3WjMNg0SGpIhTV8GHxJlg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh+SG/CRA9TVsSAnZWagAA8/kP/A9IKs8KR6GZMq1tYtN1\nqwBb0Xx9vfH4sBARjb5Uw4VZDzKN0Q0eCCOupO77UvL3XfMdc2Wvgy03uF+R\nd/tXLMS0pwEHrh5U1+EWl67lnce3yYbap/AEzWb87zeVQGDM2uhvUShZUjRf\nhM19N/G/GVEXSB/JTyvx6Qevx+r/cuttokPA63us/8Vre3pziCRlD4IrRDwL\nHSlNfg4/6w3cxPLy1BWTDOB6RA4BUxjtwDNcmIHbCrc1T6bFAtqmh7KVz2ce\niWbblRa/+Dg/DYroh9HLz6O63F0VF3EQYAIYcyfS/tyQuHuX5B4B1O4rT3X2\n66HLxDuu/2l37mIE/jkM23rf/sqqKZbeR0+Yb+0Ux1JZ/8hRKMtU+8g9OX6H\nVSmTo/enfB/JtjN2NpnXVQ1d/d9a5jC4iYuhBCKOhtNLc+T/P9Jflk5dSbSy\nGhi50cHbcdsEyLwkl5L1X6nQZZkfIkKKKQSGoxw+nKpmg4OESTP1b1GF0UlJ\nbKS6We9gvhnke8RmVn+MhwiC9BVeRZrLGK49fypSg8queuYL+wcmJSMeHKww\nKsQ53I5VUzv016FPD9HKatX30A57SD75FsbnmUc+6tliJpU8wcbArwSf6163\nBmYb46YqkgthDI63vtpQ/eEu8zuaKhEYzybpIfbjxdjDyJoi3gTegvuQ6XyT\ntLZC\r\n=jRiy\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"733bf6a0531f9b45c71488ec2832207059781c9b","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.8_1643717055013_0.6906035770178223","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.9":{"name":"next-slicezone","version":"0.2.1-alpha.9","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.9","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"5234f9bbb70f6bff3d3f1a39832f7af91fec341c","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.9.tgz","fileCount":30,"integrity":"sha512-ZgYwzF5E1ZITAnCWReUxqeGD8puONNxEAy2n+Z9D7V44DJvoXP8NZOZ6Ak5xf2fzwOXsrGFXbTYje9wWvzBhPw==","signatures":[{"sig":"MEYCIQCYqcI19mYlJulD6TEMEbhfiicWRX+9vHBIQRaJ4VtJuwIhANKUaKvOlzgJIpbDWSft8ZVrvV9m/obz7NPUp0HkbpNo","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh+TiNCRA9TVsSAnZWagAApg4P/0/uAQpvDjA00UZlNq0G\n4WPfmPaxi8nQN3xnDb7hNZ5IuUWaE58tM06AXCtAJVXqfvPe7JWu7WzFAhP0\nw2c+AOTV9QqFfTNXS7E/cHmvEKQB0nOiaClFEAN28Gqod3angEMtENGhHixu\nVw3vy/FYyw/RcC3x5iYkN1uSzUsXebnVs1D+JP4P9Uc8/lphK4p69iTnvpiY\ng5mHQQ/nwFIAPxy5yWckLbl2yKVzbFw6/8oipz6be3uJhZGaOWcqkGb9oH1N\nJm20r+y5zuprAZ11edJ2xsMpaxIVUlZIRlZz+Km5qYSkS5ImRZeTn6rlCGSS\nHYv816+mtAKRCoYwuYI0VP706V18tdNL0nusjtV7X66U3m82s6iHdcu19DQH\nQhXoldFNX5jWgLfNZbrxG7PBLiFUhTgTZTldELmDydd82g28dnsxtHsURF3b\n5buDoFqrH/RhANPWIqGTfQwTmzhiiNQFRfbnbx6fk0jCHcWjIhhFsRGCJsUX\nWU66nxvBCf/KotnDttvzHSrGV/4VZYP5/fSKW6iIlT7mZVZaX3ZyNzo5Cnq5\nzSQXbrRI6mfvLbu3o+2+9zp+8zJ+QMUujBhZOgWtzDev80ZH5FuD7ZptLIOU\nyWW42GraF6tetINkPFgBaYpou10+Dvigbosd84C3kiP0pA4HIi0/FmNSU5wg\nAE/s\r\n=Ds1s\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"59c32cf36b3236f9f182ab4e0cf348387e6d81ec","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.9_1643722893658_0.00927722635993522","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.10":{"name":"next-slicezone","version":"0.2.1-alpha.10","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.10","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"0b703b9ecaedbfe6c036ec830911035efb8dbb5d","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.10.tgz","fileCount":30,"integrity":"sha512-soFI0NWAN9p/b4/pRl7e/Dic/ubgNMhasrW0QVhcJVFCgQkTJO7EEtvLT0MpQGKOTzWFsazhCZTcBPXhDWtmVQ==","signatures":[{"sig":"MEUCIE28xi+EKuliD8pQqn2Uw+cx71YUkb0ndBQPraH1Mn6hAiEA8aYHsENzeGMa/L0+4oGnaViwGWb6JpOPwTWnZrrqP6A=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh+lW3CRA9TVsSAnZWagAAdfcP/0dF2IlBM8IwwfYvZ+MN\nTwJBoKTYuV+1m0MsBNa9OCKz62OSLVRG+HKZC1Fsu8C/qnjHMbATZxO9394T\nciAGV8gV7U2BLg8oaU9/COesBqxEMFUrD5OewzCEXw6J79L9eNeva/RE9Wh8\n7bnVW/3gnvrid/GHrfR7DTR0VwCXxj24h2CtSI+gcqpxUYgI5u+j4TbbdcQN\nqq6omL078Vc9Oh5jjfuKDzWE9psvmv19jyYucIBY5ch8m1Ed+mhQj1uVhqwc\nX6PtY8GkI+rc+V2ghEzFNGHdhfKOPVqDmNTrexCYO6NF7OEkS9WC7oS6ORc9\ni9FmnqSCoR8E0z9UJ0FMXEENo90rCAVeoil5pzwRimeKANDqgqd3P3QXAKMV\neFVErqkTQmLImwNUPMekNU2bhztLKNs8gkQI424M099hakXiP7tkHWY7s+u0\nEPJuFy9jMGL1EANAA++hbttsKLzyESMo2nZHmwhsm7sI+uyytf1R0VAIxiVy\nTetNc/fawOD4LradgD72XL/03gzaHFQ7KTzqsuSe3LqHKgAObUJPQitRRXk0\nPCMXAmF/yohzkfzsFWOJBOHNKvaDi+LtzcPrx4xUMfBiFcAUWfV1CUZS9zQU\nzkNOI4jvAhAIIeXwITvM0xf5UJjPcUAPL4B+blkA2uGJX7KgFeJcvjbMv81g\nGb6X\r\n=EfMm\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"3a75edeee6881a49495df79d9a37b5655c92eda3","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.10_1643795894874_0.36645791661295224","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.11":{"name":"next-slicezone","version":"0.2.1-alpha.11","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.11","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"86b8a3260b377c6c6726353f51824eb04e23586f","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.11.tgz","fileCount":30,"integrity":"sha512-Qc7YvFvhDMBmDPk6UNz5dPz6TqyJcAvJMHdv1ZXws4mvXwBRdnFAvqliVQ+8RN56kwIxL7wZEJ7Z99uj6ncFGA==","signatures":[{"sig":"MEYCIQCB+S2YcgCBRjaR80WM1sKiCLzClGU6/MjPPdN5gSBJ0QIhAMPCqgySYXXj2kq7Dl9OYjtrOKp8XOadP5m3jGdHC9+Y","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh+/7WCRA9TVsSAnZWagAA1S0QAJZ+EtyKzHB4otQWPTBy\niBN7zTBQ7pAAwO+x1m5VZUriFFJnN4gkPoSuRR9mirnIjdvZutKa90vSrX+k\nAL/1lmR6F0wZx6htq4NnTDj6jA9uOdegq8VCRRkvw0eBW0giZBSwjz/3ZhJ4\nfFA88vfBJw7NirU61IDe/+7/Dux9QcDivkGb4+z8bASDLhqTzIriR5Qjlym/\nnI1Bg6LPQpgRBVbPwycpK4twAKNUMlyNB/f3F8UiX1Cbse3ZqBh1UuihxD3j\nMCe9phWRdoRDkrbrGUDkyJ/sBpz4DMBiA57ZoEoAbC3x4GwH/tsNfxir/lDN\njEeQB4SntbwUxU+3WyhxyRYnsJIU9Npq7/AFsRCFTf+gNZAc75wwAZaMVcv2\nPPLuWBZzgOcCs3lnyCyvXEF2sASA+81Q17EjPIAir9rmrPLACP5W/qyaBesN\nqhAOM+JeWEmMdppOtrJH7l1SWt9UvLb6WyggBRJlNQmvXuBzgLIzj6boyuvJ\nNi8hTOoIK7mfXR6pLQq1QLjt/qKJw4WS/d/RbUgnyXMGGjQ2aH9kZ+b4YVwG\n6Khb29rlAuKVZkQnb/g6pObsVsqNg5qmXHE11vuQUZaQDYYa4nPfgedK4+ig\n2IHZhnttZmNOrmtoVX0t26cF5ub7LO3tFkD5C6mrgmPS4qJxA3KkdX2CEA4J\nDUty\r\n=gJX6\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"8902a7ecd5fe4621631f8a985bf111903f90ed2b","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.11_1643904726704_0.44158915982183555","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.12":{"name":"next-slicezone","version":"0.2.1-alpha.12","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.12","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"12603994ab3f44d9058ff537d4ce1eb9ef3455c3","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.12.tgz","fileCount":30,"integrity":"sha512-UmJCAsW3cIVOkS4ba6vL2X64VO78Pv6Zzxfx89rDWzgGGb2msNQGliFPxxGCK0gAAc8Q49NXjRmZ7+Tar1GuZQ==","signatures":[{"sig":"MEUCICPFF24C2g27UXsMyzoz1kBkTy8uAl7k1va1ZPcbEPVBAiEA3MmzFTr8R+BRTtHfymFhPifDE5fgC8TGVXj5ygMgv6Y=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJiAR39CRA9TVsSAnZWagAAkuwP/RXxkCyPJUOjXaj7Lhfx\nyNipm/PiMQaRH8YyQ2p2z3H24hA1T2K3fj/ZohITobvFxl3CNReRbcBNF8ku\n4/hoNkb2W8t0aNy1Auhx3tclwLN2syidhcFewURg8vJvP64pK23OB77GurQu\nCNBKEPq4VZWWjyMm0OVIgfbJXqMyq1hDqolEuN+AjUibbKHNqOcABt2bt+xt\nCWsavL3nrtipGIFMtKNzC752iCoOllwZD+0jc39zRwrCb4VVm7h8IVVMttF1\nKfnQndMSwS9X0TBn4UNsTksJ0EvQ3oDqOujCPCsfJ8HdsoNYdmxm3GU6v8DQ\nXyz1inglu+F1pqQ7HRVKAFVtkt/I1/wmV1dbH41bBidn7xImhkytpeV4uFh5\nUirDH5WT6+mzhwLalqgN0IiZcozREpqEhVCuOmNmKBedV/ptVqDIPYAXNzNf\nqzAb6BKExAyB1VofXTT+6LGISPBxzXMk3cFneLmUvIKy50tqlaW/oiVAcPN4\n8vyg4sH2meetCGF2z3BMjKr/MuLrO2fRqJT/ytZ9vleesuSFn88aMj+1Xubd\nnfZFuy75KIYu8sOWvYgfUtibteLaZspUQfseQDY/ANZIlzR6p1jie6yUHLcI\nxTpAs1V9o3QdTqB67WclcREepwPiLGaGUwDaVsY9yoZCj1F8Tp1N9AoI3/xX\nzMu5\r\n=uu8A\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"d63a8464e3b728e4e9f547d2697b24fc136ddd25","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.12_1644240381681_0.38987778167348797","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.13":{"name":"next-slicezone","version":"0.2.1-alpha.13","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.13","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"6187812294c6cbbb7626891dafc8d080032e5ee7","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.13.tgz","fileCount":30,"integrity":"sha512-eM8aiJE8Yz/1fr5NnvSTGN+8kBF3+yhbG3dH9LyNtXUU6ztwQPetZCVgUdLyFwZpMRMAJktYHWBYLtS4/2B6fg==","signatures":[{"sig":"MEUCIFzGuHdLyktbLEYXPY06bpU/rkeSS4851LhWYKr6iNIcAiEA4kxTDPwbquVxBqvAk3s6NFixBgLfGCzaKl+M3HLGUFM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJiAUKvCRA9TVsSAnZWagAA4JIP/00bZ1sP2lZeZ9/RVH8J\ndVrPuixBF0W5TLqE+beoC1jCOnjF+9GszkZ8FmO0SOxkmfyksDsXrlpPF4do\ny4zgW9CHUuwR67Zc2D/I+0dcwsMcyoOi+QJQplzrJPn+p3Kzk/LIloRv5P0g\nmzdKT14w4oG8XaAwWo4MuBjqeVveIxccRQ7OruLKwoYsxzEJDxqn0uOEh6L0\nMT32UlLzOo15g2ZcDgpEqChv9aByKoOM99xxTept3N/5WxSJO967Thvu3NAj\nIvGL2T9Pgm6Up8VX9l9ON3LOwtoY1eKzZ/je9rPbBgcdGDGdIOgxcls7uSeS\nezwwJMHvVWx/mPDQmzj+sLuOPKiiKqMSPOlAvUj6m2BVrW9VidA/yTAIB8Ww\nW4R8ixSRhWQQI0f9OQbnNXHgGjnSPLzXXCc0xhyvesNzyZJxEvp9QbMkX9Cj\nCcmPPGAjo+VA3Dx9MO0PqXznxXP3JIS5tSOpDwjH9PyWV+XkmJSwchvx+9lY\nYGkSKorXhh9WETzcCyMss8paiuLhC8LS0nVHirZJ+375dhj8b91Asd3A6SX9\nFWDtobIiGmLYojMjdNzIOdUlL2HsXLa9uCRkRtDTuxFASKkzRT2XhvmZrk0T\nac+Li5fAl69blSR2QsxI7OdLAlVaOG+6Jn2cUa3T5cR/EoNmCc+XEuVlPekh\nxm79\r\n=W3zz\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"d1e985fcabb6227c5e4230da4756124ff3343389","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.13_1644249775296_0.9423409147830089","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.14":{"name":"next-slicezone","version":"0.2.1-alpha.14","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.14","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d45513e66923d8265bf1a87aeeab75ae13a727f1","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.14.tgz","fileCount":30,"integrity":"sha512-xnzL+WUZaUWCB3mON97Wvj2UxNve2IVIVpUMxvYobY0KmDp941WspcMtJEY73napac0gQFPVguRKsrWQue/RTg==","signatures":[{"sig":"MEUCIBfOTwmJXbfGBRVrgfaXGaGsjQLpiFZdm2jjSDPSnPCmAiEAsdy70Y0XtxtP+IL+mJLrPKT5n2GwZIFj4vUVSpoPZbA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJiAoOLCRA9TVsSAnZWagAALbkP/Aut072HozS2Z0AxamFo\naPYy7VmRLjogqocniOpLuOZFq04yZiZRlMXzxeVU6Q2xTfCPqbm8YJReKozI\nRtsuJoLnBrwB9j+FzMr/aMDYDB2PIYrg4cWhN+0MfZUbPoLMD2Yk63LuAfwt\nVSLizTR7E7Q44Fau87RjFlzOMMm2VR63iB9UbgE6mFK9F3R/IyYe/5sNAwD2\nf/tpVPej90SXrfST6D73hBTQy6t7cIcmmIsYjYk7XZSa8eF8xV4zUVnkc3eC\n5GrFN1Vjv3Pcr5HFOiy6D/01+7z+WJ6c0ty7TxjIaRQ5/M5shG1O066oKwAA\nrIA5Eq67ePrBSSnfVdaaHGlyfJQ4RNTfU9TXgEkOuuEdoCRZs24o+9xPKjE7\nvruZQuMSdwOBcnlVt4w7NWFcOqrjUoinq9zCSHX5bIxV6iZ/kxb6bBn0Hvws\nWJNE67hZhHg4QzxjycuzRGLP4P0QAf3tE/ZYnNNDZJOmIVvFv0B727v0ZA7X\nf8BZ5lbDDeMmE9JW4kpRRzMJMyoKLDyw3nuH4cnbX2KsLeMtV8rVwZVis4mX\nbYm2K78qk+kr2hbk9ogSJrpwTG0oFW1VpJJ0R8ch4r4FQIySfzCC+63X4mLH\nYuxPFObRbPbZykHnqTeBdsF6f/8Tke+LxI2xy/4fUwSPlb5O1hYs65NacuLH\nuYZM\r\n=EMRZ\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"af64c6325c66550046794908e207f9d33acd17ee","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.14_1644331915657_0.6714453822191244","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.15":{"name":"next-slicezone","version":"0.2.1-alpha.15","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.15","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"9ceeca32912ae363925fa496d220515c6ebba4b6","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.15.tgz","fileCount":30,"integrity":"sha512-/BqjPgug8ebLG0PDJ7jODFQ68Nblyv+JU6bUcYYX/51esavjL4/4r4blFd9FYL6uonvjuhJprJIx/eqmnTqLUg==","signatures":[{"sig":"MEUCID+/VgucRM1xAxHu/xEh7YmPCHsTJeS8628Q3KQ7t67oAiEA/tSfTR/t5bQZvkWXYrCOCdk4+HVBMS91DHSrPxCINeY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJiAoa9CRA9TVsSAnZWagAAvhoP/1+K9T1wNulZJpt7agNq\nDIymJGYXuM6j4Sz31l24/GZKtUJp66hMzrm6rk6TsYiz/oHL7Tguj0yC2HHI\nVHoDKX4qa3KGa9aiOBONQITGhbCTxlxFewFcXJ8G3+aolQ8OWblACZaidzLL\n4YwYhPKOy/ITv+/Y9BYK3h+Hl8iUOYT++K36lu7m2j+g6FopS3SckTiCpQLf\nVrcX9H/zn2oOAiVh1PyCjWghLISZOSsDJbiDNxG/jwiFCmqZpId/B66j6C2n\nISnix7AJmxyLcaOjIsQmogdZz5f2IrvjilVFgMlqSHt8B6vDDh/kUqThgJCW\nUhdSl61PFBzom6KssWXLifAudZ683uUyaQsBsWHw3muquZ8yIcKROk7hBjx3\nkoCMozF8ES7U+byS7ssz+tK82LdZip9fjKnH2ymFcZOpPg5Wm8H6fQD2avr5\nMQpjOnup6/3KFC619UQcYvTfKu9B6l9jTTZ+WDnTdA7H+OsUdiXIW5evsYRC\n2kNUpoWVxN+9SOMGPa8UYlwnGslA7T1s1OkWztyuCd9AJx+FNq9lFbFUJ+4M\nRo4XV5Lho5okWPXYSJAydLNu2rc7dmYrrc4o3HK98kF6ur3JPZtIqQaRRFnU\n3JmVBqT+EmE6NowBmVaKLk0PYlOwlFH5JfGFd9GknoOa7JK/cUdbTOI/EKAo\nbeWN\r\n=xQgp\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"7a441d3109214e02d432576482bed37714423895","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.15_1644332733494_0.28488280390989407","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.16":{"name":"next-slicezone","version":"0.2.1-alpha.16","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.16","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"5930790d874fa4ad906bc240aad139cd7114ff1d","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.16.tgz","fileCount":30,"integrity":"sha512-z2JYmfPeNQ0044OgMYBU0qHXzVTnY2niRc9eKkaTVGD83o4VheOja0XmzmjbyEr0StwBXog8Wl79+/H9mZZIXw==","signatures":[{"sig":"MEUCIQDnVEyD4taGAO+N9X5KYxtP+zruZGE3CesVxL8sxL9VRAIgWmt4YbEMW5yKUbJ4MyqF1G2IJtqn1zpf43jP/3g6MHs=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJiA9ghCRA9TVsSAnZWagAAsBQQAIeWWx8yOMj3+FjFYrzW\nAEDErUGyIMiySrPIL3yIQQ56AS5MQz2LXgMOo65VH3ZiCJkS0heb3cOkVWIP\nK9F7H+H9WdF61WnPO6Ekphd7b1ewdQPQu9ENkpcJiaTSwJPsk6zG8o+O+qaR\n740FHzz8RK+cbVA9Xot6aLOSzb7nFJ2+ysPdjmmXSNK8atwKEesNPiWYPYhX\nHRrsjpLKYV55dLMZSJviiYEf6Ec/98P0eNRFHdi2f9CcWYlM7EQJZe2s6EB/\ncGDlp1E+vNYxh7VZs3j3wA37ORzoKPvXZes0gIVlCZS1a1lxzcI9tvSzhnZY\nQUfpS8RVqGBTuzEbFZYzOXf3zaSxDsr+p1bL78wNu5MmwbdXME01Jrif54Pv\nwMCrenSnELCn/UBk/dIXNn0oSdahcx8/DsGXbcw/W2YqAI6RWfJ6tp8Tgfvv\n62SfAMHkZhAjxvBYIyWIAGyi7kLLv6tM7/buaqopG9maFF35FEud83NdyNb8\nAAhyN7FnpVH7uBuvgtvABXFeq9dukZ3JF1M8cs5kD1bqlDO/8c2JrsAd7iNS\nwwP2fdCrSKsHkXIL12JtaXrVKQj6oDbyq7LOiaNR1cZL5iCR8Zf3RMe/4Ytj\nDyl5cMzaHyS7AgqeoWRH7fMtK/2Ag5mXSH81Mn1rIfKnqJIqrRXN9Ic5t23c\nou1r\r\n=BXvW\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"b1cf9fe85e8eb26a5adbbcda4dff53c4cba5f392","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.16_1644419105351_0.30911950312168446","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.17":{"name":"next-slicezone","version":"0.2.1-alpha.17","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.17","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"3fec608db2d18f6ac78c093a44458c331a9666ce","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.17.tgz","fileCount":30,"integrity":"sha512-NvJ7kZrJl4s9CDobJAnsEBdWd5DyeoFBA5fdGo9NW6AUT2eHhCpGEFQZ0dXeFI9V5ua96NQ/biogAAH42PoX7Q==","signatures":[{"sig":"MEYCIQDEUnmwCReWWyKku+/zqR3CngHcSUziy8gV1B02CA1mGgIhAOwLAQlJiaM+gJf3qAqI0U9Pjb4DDRXcwnqhw4WvL1hM","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJiBOAhCRA9TVsSAnZWagAAUxkP+wYBH297XfK74bCYUfpf\nxNqz0hHgJAOMxmLY3zmbE9h0xBtJvZWTEAhs+c+1cd/ug6mVPvpjgi4bzgIl\nrVjnR0ZxXkTizDGZ487BKfCOHrTuV/Md0VfYtoC2ZwM6VJ5peWnIR+H0UeiS\ncygndOU9bZzzJHb1dIe5jhgPy87Z5eoyBQu9okNBWQBgGvi7d6NBTdozewyB\ngbZsdSgb0TnWtDNYGDf+j6rEEiV3iRcS6h+s2PmFSqmZlYtU/6x7GWp0tv+E\n26NU4QjPAbDTN1lOA0HPeql6JtYAjjQMfPlAx61K/u8Jzs8Vqw1HYS3FkO4Y\nlLlT4wTeTWydilXrrLZ2blt3/uE6PS+VtdycUN1no3VEKYV+TsXar4Rf4unj\nxAJUpdK7JvFg7cctEoP6zRH6I7nXMl1pqXnHY/SB7uL7FkeaAzHtT5O4LEYg\nIsDYfJosKFyMMUGA4/uYq3LeolUqM6p98to/N+yueCnC8QBCbNJ4hOihV6WA\ntE3rCVp5Ew++MkpyW/uY61P/JQV/zRPuhX4XC5BFziyg+kRvi5EoaCpB6XBZ\npZp+PMhJB9nBtxemFnwv6GC/A/lieuNVxkiGi6IdFhW16Wx0TnxShrT9Wa6e\nafvukNZ2fSZJx1GuhTxvau4ghntGidakfHW7Uz/vMBRIYeN7RLUtwMomK0dT\nadPf\r\n=Jkqy\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"b8d035fca3b809f8be8787f3113c7c2fff2e03e6","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.17_1644486689316_0.6522034977410154","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.18":{"name":"next-slicezone","version":"0.2.1-alpha.18","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.18","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"b281f66cf2c91a6ceb69a50a722ff476c95969fa","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.18.tgz","fileCount":30,"integrity":"sha512-RnDhX0cMAdRTCgfAeFh9ZSG8lJy0devN2t6bojPTTVLZjQVuAJJCzgMZYopqPkHGZreOpODqkXf0CxI9EThNlw==","signatures":[{"sig":"MEUCIQCE9ON39lcAMnlFHy0GUuYK12JGDMvd3po6HAxLkKMQ5AIgEbh5fWmJYlxp+wQM1uhzfwsmEFkiTqTqAamKw76r2o8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJiCmFDCRA9TVsSAnZWagAAzcYP/ipH8zy/HNxlWBgCV2So\nk31aaBDHQr4WInKgXQ0+I0hzbx7HK6i7P6t1jm6MVRHa1mv9fIu2yelLpcO2\nJ/SkFoRNjl8aOuaJ2mFmJxQrrd+qRBhA+VDIJ9t8ylY6qc7y0FRQVD44VeSm\nZb4iw3YhD3bUWagwFLrL91UPMdGInrH17Hmf0jANvlGZn7L7mcWof/aci+/k\ne60s3H6zAVlLXHemXy65TAd9ULo6Zt40Xie0buMMdfgSRfzHV53Hoxie13c2\nf6bWO7eobyRiZ7KKE5fy1nafUsnCckWMDB030ZIpQ0wz+82xFb9U3bMCwvwc\nzB7nMEJIgWyrjzK/sW3kwOP0YXOph+DMgBcWMaRrR6KXveEri+GOeT1NOgKk\nCHb16BxplJCmTCcLjGgm/Oj6uJPagJgdbnVJRrs1hFAuqqXuag15hXT2XUFv\nEmeP2U1xrU1VIc+la3zkKpvfOIO0UDwzl8Hc+goNXVXtsQitdCsyckdksIHf\nAkB3fO9+y+IeGt9twO81TtScCwVfq2+jTCkPtm/raPYPMqD6h9F4WBvqE6Hp\n2PsPNTBXF1NRuGNVBd3soGFUgfSz/D/Z9i1GSOou7UTNDJf/aPy/xz9hydDN\nj5Yn0ClLnAwb3oa68Y7XNzFKCeong2g9JU6gcSuizQSuKmViqzum4fFLGSnA\nlvVR\r\n=t5kF\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"43c2d79bbe20b8405dc20b4a379b8e44ca32d13e","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.18_1644847427105_0.4575410869998524","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.19":{"name":"next-slicezone","version":"0.2.1-alpha.19","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.19","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"3efa27ca2636885851b28aafd307e9ea85f99f36","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.19.tgz","fileCount":30,"integrity":"sha512-cgB3xH8sMPAbCOx2YezefA+b27uEVrvDYw6t0jkjNZihEgynhwtP1Yk4K4Syia9duH1JVptiJQ7J0pTPn0BRMA==","signatures":[{"sig":"MEYCIQC9UPlUq1vBwwv60XBQThFpNvacjdXKxiiXYQVsEKfpYgIhAJ4ofxen9UL8uzzAz1qsWkqCJPEiBil1FSwFrjmosryh","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJiC4SPCRA9TVsSAnZWagAAeE4P/i9k1mccQ3RAWHdiBd/G\n29jX3D1e6GCwELTKJ65jvGpk9kj0AaoefMPCxEnh0oc8yyCvkclnBHW3dsBJ\nB0VQ/luG6Z/H+9gomG/4oU7BSqLFMPBIChT0iiJYHwp/8LC+Zh8JKHFAHlBY\n/0sagQlCdTzOdUhItqm5tcX/qKWChWg8jb4/Uz1ecwWxw83NZYpmYFAUe2LV\n0cbPT3pp0UudQNAoGayBxAFXpYmayUIQ3XhUcJUnalG+INUZ1NkR3AFMg563\npNWTLw9EfLMqUu3d7KKY30+u9kxNQjNzn4MypQGThjOuXCJUfBwfPJ1a9g9W\n6eHlvRDHCHAYR1T0Y8dugk12F07wS/RDsXbTuSzy4Tpa+ArKiCQ/SaISS/KM\nUVhMUQrslQcZAopaf962hsNf1n5vR83speRoOipiXstbYWe8fPQfh6Onjkhl\nvGi7QyA85PfV9Tmi9Db8zRSDOfO2Kd4O+5d6QC1uKOKmOAygR6BJjqoHgV3C\nCZE+//Ulcmxxh2zmILM3hGTF8PiypiFHOeu0ZZ2k5185N2EGxZEGfJIH667Q\nhB8ecxb8K41ui1CzWdwnKfoYRMTUjNQIxVJUBVPvJ/6DLgeCo9pKY4yzGICX\ng1rBcECd+ZQF1YvuY2afa81piqbI5LUGXd4wwFrjzP/vLXf5/iq29LkmUpnn\n3Oqb\r\n=gg5k\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"1265d80520d99430e9d4972c4411aa45a1ccd279","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.19_1644921999475_0.9172863348369875","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.20":{"name":"next-slicezone","version":"0.2.1-alpha.20","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.20","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"0c3518982a06bff341848529e8ba954fb8e8fcdc","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.20.tgz","fileCount":30,"integrity":"sha512-51/v8+BatU0Gasrfg4uM/xfooRsc4YcEc/Odm1U0jAhZh9aFuK0lpb0q8wGN2bQQOfJ+gWRCsODkkhMslxgugg==","signatures":[{"sig":"MEQCID9cFemI9UW2yjwB+GpiUjmswLioM9G8RpYR285271PLAiAsEftGRrnD/R/nxh4Rvkt8mhRmZ5SiZKMPy+/m7f2rzw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJiDNVACRA9TVsSAnZWagAAkZQP/3OHDV/LVe/kYAuDWQeE\nEEcDjIotZ6KnLY2p798OxXiLJfcvbvQYuOz9R3XE8Uwr+Cztvp+VaC6f11Ye\nMuBQdURSlp4oV5Nkp0aOP3Dqrdhli8EzJ2ci71eEwy0rVUb3iKUilysjEyUc\nabJEeK/vVaq/pbN5Zrvt6GvJ5AkKWg2ogPk46PIy1VK5g1L2UL22cnTKE6GT\nA0Q+iGJM7lmBGakuoH2Wx02Ojrz3GGBZo4uwFQdIzUeYWtAF2rbbADx7ikej\n2saOP07Xo/vG1/zoGIPtTqxJB47MrZmI7dmBXII/zPDd2fMh/LnFKe1jpy+d\n8cuHT6Yx4KvSNDtiJsU1+6GJWd9wVgXzN6jRIdod+Q9FXWaW1aYdGoJhuESN\n7mJzfT5R1IUtpvUnzdKHynDhCF/+l5JmsnoFSmclK8gHvzCGzEqrsWkiAnb4\nXmX0QnkKLUJc4jFP2ljx6d7zAwdFL8d/rurClzoPHyMIqGZXPGWFsoRM8nDK\nKQvnSXJNR93ov/nd4nQ5CtYlk9kew9GaFlY6FzXPrYWJXmdFcfPK12wj7xVz\n1BgvAxTsYGyJe8ENN45wf6BVRD5xzE7YZkTGSpIpNBr3Ed0peutiP+OTT/vo\n1fW7AyxJcVWGbzYYNwyO8hGmujVVNXxl4cpSBOB7ak1OPKdYzlHvMytOTx5s\ngJ7j\r\n=UgPN\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"76d096b7df288c36c53c4ac3e934523b3b6ab03d","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.20_1645008192225_0.2077783557449986","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.21":{"name":"next-slicezone","version":"0.2.1-alpha.21","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.21","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"11b7d877dcd40c8a8f791a41d6e20ed508df810c","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.21.tgz","fileCount":30,"integrity":"sha512-eSVTi00wTcDaLvAiF8w/877OzLaSs9ZSc2m0/5CfvEIwjJwjXzqTrEW0ZcMxnf8a0Fh3lSUV1XJElPmOrlBvFA==","signatures":[{"sig":"MEYCIQCL12tvytNpuaW8jhVqP4hbSgs9SJc7IT2HnBANSp3exAIhANQ/+LVqQn0bJKmMn+hqc7VIDKRgEZ4ZoZlIhPqKRhX4","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJiDRPhCRA9TVsSAnZWagAA8k4P/jnv8mOjE+otDJiz/K3P\nqWPP/4ijAfvNMdu73LiOI25PART57l+bgVo00aYBGm6CStbfFH2Tf0iBDmqp\nuhhwiDZnUemYCn0JIHzmXdwwa+ao7yjUsafu3UXaypIt9cuEVlypscFNXUA/\nWBY0PM8teTMIwO7E8p61I1nySKl4hCsIR2AFld4ZtImTvJg5K8FZubHUdhDL\nJQnlBJMQ0kxYomX700YE/iCNKBK6vHPjfbG5u7/OhetB+Sn/Tc7YP7s8fV0n\nLY+jhfrJzGJQIMHcGbvoKXLanh5RpW517/z31CfMXFGPZfE13Gumk/txMIXQ\nVAx2mFqM+geHoWAT9m1GwJkS4ZtAk+5ohgbP1aqqW/R/L0ye7oe8fBexWcFL\n1K7iw+xdn/Pq4eBaMGpQLW0/EyX0pQXh41vkiaDTOEHg/Aq8TR9QJjEsP8iy\np9r/FZTgKlnCFIlZ2HmYi6VjuAcVNjnPUrhM4o+sTJzFIrg65AB8ZI8D3ftq\n7w0ku3ABiEBK6FHUDkb1xEk4mKRywWLMjDI8SUR/Kh972TgvXHvKdvbXdiie\n0JPQDBSvrw/phhg76PBvl0GI2Axxu/KpsX6/QmlKKdVWWGSFc+iUpE1DbGjT\nJ0lrQx4lbtfgHAEaGHqdzFXHo1d/4gcxuBTiRJswvdgdHKcjq3r9Wf7hiqSy\n9UvD\r\n=vRjZ\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"0663b5d0b5033ea9fec8152d160c0945b6dc41a7","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.2","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.21_1645024225476_0.7215233534636756","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.22":{"name":"next-slicezone","version":"0.2.1-alpha.22","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.22","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"844072df120ba74507d3d850b9aa4d86cb3bc1e5","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.22.tgz","fileCount":30,"integrity":"sha512-WX5IeUgvOmHlar6+fGq/Pa2ALeIbSS851mcI/gDSIddGjFKW51Tr/FZHc2/BJr2bXB6ivp2VYYTkZJ5KB7RF5w==","signatures":[{"sig":"MEQCIHAF2bYiEOz1cEh5QBYAs6WiuH1WERnq3eC7j5Wygre8AiBwNt6apMy4eZZoLvuY/8I4yE++/7M2Cp2ZLpLke7pNDg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiDk2QACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq9shAAnslytyCam5GR6S5Pdd+eTLGf67nbU/lEwIEBBnw0Ol52FHKn\r\n+binAAoyc3fu8eHUFLmenfkOBSvoxjXyqbwVNHo/iOokRh4hJ/94anNkY/iO\r\n6TQ0BChzEbQw1ne93eGySrmNphzkX0UZnjVbKhT/H6NNH6b4XmikI9VfWKb2\r\nlVwZqEOvA9BryFPwYkUOi9QmurkpHano3MEtkhQJE7WmejR9prqrQUl3VSNt\r\nDbsO+qOYFGsjx+ElUFQ/hIvCwPoFUW6A4ez+5Hd1/+pmcOUrv43tfJ4oWzmi\r\nDbKZS17hsckq0QqIr2LRKrXiXx7I1wHz9sAie0X7aPXlUZHbOt651AUXHkl3\r\nFjvTh9GMVvN8tqhyzxv9XORoAFaUHaFn5XnAHvexWvI0k2B3YXu82GRtTojd\r\nBnAUZxRBx/3ZMb7me24JSiWZ5w9+TmErdxFM+K1MGn7P+p4ot3S6QN5UjsX5\r\n7nlB/7/DTRcpkVXYv/zi1c9xsaJdUPVYq/FQYCF9UiTRL/KBKLFnY2/jZAZh\r\n33mUoMNY944WtUlw3aYtMz3J7WEthJ9DrfRYk2LnTNB+pKeKsuSiExSojrbC\r\n+KIsqh0KyDpsg9DSelhS7RV1Qqb2ZVUQInm6H0jFbY63NMAxy6gbh5UOoRnk\r\nk2gcDrJvBdaTmRErGpXRkf1iyC3H77+azGM=\r\n=7CxM\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"0dd1054ff47b56f30dd89cf0c79dd1d3d3856a7f","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.22_1645104528773_0.49228271073881835","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.23":{"name":"next-slicezone","version":"0.2.1-alpha.23","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.23","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"de4e23b43f251b48a847a31d14c0bf0d39277a1a","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.23.tgz","fileCount":30,"integrity":"sha512-Ct+MhxXnFgcD89n+keGJEIYU1YrAe3YzoCKO0lVkyX5YK9PFlUmXhkTLyMZJxqCOI/oiHDYiM7KNij0gaDhG9A==","signatures":[{"sig":"MEYCIQD1cHxX62o7C6KkrCi+i4vXiIn6vfoWr6TdcfTfsT2a0gIhAL0NnvZZwhUG5tA7F84Q8IqGy4u1PfMZcuQR2c56shr2","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiDoJ7ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrZ4w/+O3Qq5B7oPdb6L589dj0Rre3ZbAqMX3x/cQunfiNtedqbE6Ou\r\nwPjrl6ACk9QfWc9vefQlMGVRd7EyQZO8wrYixT8Pjct4n8AYX0mGE9eBn1yE\r\nyXAzlZsSZ+HTUVndcJBEBSkddKuTYonzh+MQ0pDIx+wZrFaDe0gWHLXl9I9Y\r\nNVqk+1KWMIbAbLiXRSbD4iHxEOmPF8Oktx2OkUlhChL8YaM2n4icNfQSHXMr\r\nTh8NEjzIZtHCtZygQNWTH8IjoLpNQFux6VZ69cXh980GLxDzBcAikzY0nhmA\r\nNc5lMHCuJTn9zPCSPqe+eW/qo6PAfQr3EEZwZNQbnAX3NX83KxeysTc14EPf\r\nFguRSF6qC1cxGL1ox9UDLeGOo39q4HlYvZgdGd060C/oMfYOw00eWYW2LBjj\r\nG4vLAvy4U61gs+Ji7IYFrziqYUwHB+w/ZfD0DsbUukEQJcszXMqMX2ih4aZH\r\nW4ORMLRAjODv+9sG0ZS3FuHb392N9ezWgw8KwcBgnfeI/h420nxvjVoTwWdA\r\nsxt/fC7XNJ3MGJizdrWa5o1hj9r7vr7V79Gr60etp4N8GRhInjRT5AsklJG4\r\nN00+dqoqaqcEn7vznUDnxX6ED1if1Pv7mM1XJv5bIgu2QGK75JaoR/+6n8mb\r\nAVRZZ5d8aJC8N9AnAyIjsibSzjnNXJxZj3Q=\r\n=6UOz\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"a120ad211cebbcd70682dff8bf92747a476e0e9c","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.23_1645118075479_0.5907366916630132","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1-alpha.24":{"name":"next-slicezone","version":"0.2.1-alpha.24","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1-alpha.24","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"7fae0b0d00c95769e832e5425893fb0ecfb6e612","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1-alpha.24.tgz","fileCount":30,"integrity":"sha512-XYfbbH1I/IerjSma2f2xgDjyQ5dAPEPsiAXAZKOuLIbXP0b8Ihr9teQFgrZNqqwbEuYKJzNO7uOkwjMPV0cGxQ==","signatures":[{"sig":"MEUCIQC5nSRIKcFde5UgDp9L3DyjZ7332s64cu44GJifXX0bLgIgIkBKMiBT+EC9DJ+9DCoQNx4C79NLHeWRKsMGsQ1w/+k=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiD3rDACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoTFw//YlZcmQTb7UDEn1pNW3ZhyeLrNcwJhX1ORvruEuhSBZDdLaBx\r\nHHFth6BJREvJikCMEKmayINLWRpmw3R2xTNA6ucgT8V3mAPbJfgJD1D0X404\r\njn77lrbH4gEgQRSi5wCQe91zMMBcs9KNQFJFNCWjR3L0HOxYf+JUS6aMm01P\r\n4f8cJriq1tNcPvL6yYBOVG0MSty4cy3eTzJAypIFmVL4vPGO5gKhR1Btp3Bq\r\nI3nJ/Eo2sfLHUi202Ud4BcRQQX0Au3/p8DhpWE0B1EXzByyX8+yf9kc3t1rM\r\nG4wrabpgHcrzFA+Xamj2SOPfQLiLHXmmXTdjwBM5EhHsJJAWdgq9BDzHwW9f\r\nxsyNRHTPZ0X1Cu+kiUdku4qMB2Tbd9tzSyAxiDmnA02ti762t9ALh/pU0etD\r\n9oXCDehJym55nquIun8u7SXy8NpGaCl7umRb2Nx57lT/Exu5LjYXBuHuSveC\r\ngo0aqdtDHWQ3cTO+0oN8l0diIm2rj/RwaQz7fvl7p+tZ4Z0ZdE4BtfKpwYnX\r\nfVdID+xuiBoMZsotgAp+xtOxZxBarvkom5sLJb61QYYaZyovwEvSoBUb4o1i\r\nNB3X1A9bArHc1ALlYkFGgG18UTTXuXBdArkjfwZjy/bV7Yz/RpzQKDbcaYt/\r\ngK1EUkSVIwG/COtqmFPsLwlfkID5GVaUfSw=\r\n=GsLu\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"0df7b4a7f40ec13598d10589b0fe1405b4513a3d","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1-alpha.24_1645181635788_0.24969081285438866","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.0":{"name":"next-slicezone","version":"0.2.2-alpha.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.0","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"8ca91f8173af4fe8634ea189b17787b3474bd0a9","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.0.tgz","fileCount":30,"integrity":"sha512-qDW3kueqN4zXVayjG6RcxaNDMSRv4o9bzphecPyTq1odKOP4YteAcCEfeX5Zkodk5EmTlWo4HLKr6CRQvDZNzQ==","signatures":[{"sig":"MEYCIQDibH4u+otz2EjZRdqupQZsg2iOtZ/LTiUvPtiQAO3ytwIhAMAHV+A3Zs8Iib84+pN5PWe1X8HqV/jtwbbgWwcJwUzo","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiD6irACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrafA//TmdR8OnilW9FgrSKSoRgmFolh++OjYY513ioBMtOeYxLug80\r\nBW384M0jgLvS2AJv3IhxDUgs3JPSMKz6jafyRPR6rcjmpe+o1u7HhBVMWVRs\r\nBxbqVYJq1DWYCO0lgu+Kj2M1EofGFjPw6xRkGKoOaxruunj3bZaG3vCdpVyU\r\nBkvhX2xVbFK1FGjDuDTrCpZ8Ql9KFSmuSdiNVeSDIQE54aIr9bD64Dq+Kd1H\r\nyA8V8CDolvLQKMLCdE5hSTrRtOwIpan5vWXXwGb8SCrJctWmc8dDUQsFZsCg\r\nrnGxw8SABcWxkfD9j2845MZh9cifsDvmA+9KF+FzMq4gLXGgwWfKQuZlrCZn\r\nG4GLrEnhoGrwhGQLIAjsLe9Tes9H1bEmP6S8+UVSUHXWAsIUDsxaCL4cgUle\r\nNVIzQ487kdY2FkSp9T0dfxXhSVyvAwhvRQXjOTaPlo9VQCIm/eWQkK3oOzQC\r\nhYpdqLu8jRMtQPvNK9SLPLYq5pY5Xo0QU5MGl11Fo6E/qD4iMLoCbZ92FKK1\r\n8xmw/iS59Ucjzi7Gp75KtzL/YeAn8opPrvv15HpIBfe6QbeyRaf5N/7b1478\r\nwRBVuc5MMp845+zHGMk1JXs47JK0rcB9HOI76EUE/Lq8IRGrtQINs7P/iPYw\r\ngPOVBJ4Tx46/BtVGW+bYW5sQHNFLl2PN97Y=\r\n=QxHB\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"41a40be02c8e0b8616000655583952ad6ea89b79","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.0_1645193387253_0.012892647374189492","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.1":{"name":"next-slicezone","version":"0.2.1","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.1","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"cdf74a11ed7de8f85056e6a3a9a782dac9f54d3e","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.1.tgz","fileCount":30,"integrity":"sha512-ImAQcsf97jAEmxNVk4/kEnOBuFK3NOT1x3VO8+153lN/i1FWgzBlUdQhD5vw6GfhtSNQiWtCVQ1e3ypY2LEo+A==","signatures":[{"sig":"MEQCIDpxkLtGyNN9HbPhhe1buXE5jyb7BbH0qGOLBjbpqlvOAiAF7oCNX0JgxpGroBDi6SP/eO+2GYav/VPxDtQB0yz8qA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82879,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiE2+KACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo3ng//Z9N+Yymhzvsv7s5uEzrUNQAdMaJDfWM1xH0E6jMc65EY3Q2U\r\ngFHE9Hfy0z0z07XW+Q8K+gmoa3Hv772wZ09oN77rQzpAlljZR1CF0Fkx8GNw\r\n2NKztnX8K0FsBwGydxYRWT5nNi/ooGQRYX3j6uqj9nGnorpYLHSltQ6GGUkg\r\nWnPR39s4cQReUfrsbDAKMxpGdVvqhAWyihqpR+LZ36k5PAI8x/CUj5QCpLbW\r\nbxV7IjeJbLKKs7t3Ute7aH2VN4ogZaBTQaWZFUr6cXHSAveMK7OiF9pABazv\r\nHmcQeAEcP46NvcjCKbalLp3IyOJcDjNquHPcFsaVFoJyEJy2TMSQZ9FGG6bp\r\nDjeXQQ9VNkSViXsqiDn5/7QHpsEUvNYvbLU8zFxsqz8RRwLH61wFQjZ9guvy\r\n3pkMy0nbuprMPrMPMGfIhHad199l9LhxvaIc3/wqF2pOo8nRWF0Hlh9QVJx2\r\nfjZyVm4GgtYT7OP95LoIvOT0JRYrKZhQYV5G3J79KtPmygevSkOFDHfYcD6p\r\nOPI+KgzububDp/IglcK8gG5YETHNZBA8PvZacO/vWXCqJ9I5hG3BXA8eGOt/\r\n+VKExyXTeXhWY3SBR4aWMsvA7qMKYB2JoZ/oWgat5LhLkOdKJ7jQFfoXE/nY\r\n2pAcYqm0sLnlOxufrJLgTgcAfbA//MgWHk4=\r\n=uMwC\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","source":"src/index.js","gitHead":"e6bdc305eaf668a10418b3cfafb0388e27632f49","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.1_1645440905938_0.5749152130213662","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.1":{"name":"next-slicezone","version":"0.2.2-alpha.1","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.1","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"c332430414f84a74b0d67fc57f67a15819f10203","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.1.tgz","fileCount":30,"integrity":"sha512-5/bZYAsEmV4AxQyAOFs/ca2OM4pC/FnJpPGicscpBuUzsvy2MWmv/8/W2YlRy5tyxmaJt/u4WXxStboBwiYOzg==","signatures":[{"sig":"MEYCIQDD3h4EOyFm/6jJvH9l27FO1cn6vBqIdikOcm0NkyTc/QIhANHGyrGRL3VbD0fyvSax/RiYHyFlij9TJDKJXETSnAMn","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiE31rACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq/TA//UJXtbWRrvtPnBIOPHnK3keC97vwNxWxaf/SlIgnqY6VGFYpA\r\n35gQA2j2c+B6r/7ywyhstdQzAO+mGOwUo9B+2W1b67U1wjCGdLBjXAphO42J\r\nbVrYIM6egbABiWNLqT1ozxB/mkp8eY7V567EtjKwl/ZF0RVEyUQ/5PDNAYnV\r\nZsNc7wlS/LYgdR4NSawtPDn3YEQz6/zkT4CdUZsPwEnyZIFiKTIDUWuHn9em\r\nJs2DI56Kk2bmFqS47Lyd22HWVC5nexhniI5qIPtJifRzxHJm3Ymw+ydCzDvN\r\n6DvZGZs3yoibk3GhIREBmJFDu4tbMCFX7NhJiUOzQ2c9zO7qrKPUufWiP2hM\r\nPXtxcgIH5JxdEz1f9HdC6eJRuN42WjcFKP/RBz++EEFXykHQTlS/cFu0ZkkL\r\nDprgQ5zbdFoOp78S4wvPzsmaEwMnCc4N72vPa15JS9ZGY+BOKPYfpFrnXrAn\r\n4IDWIZQePvKFoaqY0Hb4hpvIno9ULigFyMOyKavLZugNv79IJKSM6tSw83kG\r\nfAnV/gihxQOGmtObr/KYDK7PcHIbx2FE+0thKt/P1iSnpfmgtwzph7cOgI6l\r\nmc4XCwDQy5S+jxIncylBaOChKmxMIbvn2UbqktUInATUqHfdP5N53iZtlu05\r\n5zZCrs2hFczKf+VdN8ZZARywRdYBwe75SFE=\r\n=hqV8\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"90524c1f119658b43d5ab724f12434c073cdd7a3","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.1_1645444459282_0.756199632351156","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.2":{"name":"next-slicezone","version":"0.2.2-alpha.2","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.2","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"c47ec7a101e94526a08d26e69530e08ef16621be","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.2.tgz","fileCount":30,"integrity":"sha512-XDHwy4fZnxwD8AQGLDMyBPlwTXthZxbk63fRJbd2IAo3ggLfNDcYOLQUEz/wDuu468/WPJKAiJdUm6sxpnwkOA==","signatures":[{"sig":"MEYCIQDLtGZldw08Y8gsatQWXvDlebnTcd9+s25SXa+giZyzcgIhAPbnghl74GHX9Cj2X1fh0mpt3fadn2i+55ytM75nb2qV","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiE82RACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoOwQ//TViuPw+VNB1ltWK7RWjeWvShUrvmp6/1ybYwjLLxi+oSfm52\r\nFvv8PfdfacGqNYivBKuot58ZCoAtSNul1E1lvS73JhaN5lDoqTE/ywfPWVDI\r\nwZcSBNf8aJZWhVPaVoS2xk2hcUJhPSgKOeN1TR1UbZVDitq+jnRkxxhpAvdb\r\nG1ZlnIDZqqwDEzW9G3xpnp0Zy+0KgEQv3hi5ErWscA1sG5wh+66sYGGAMdzj\r\nca5aEk4K+EjmvOgLRkNJNGC/d/HPMY1TJA6pWy4FgaEjZ7MEE2SH2ulSP1fJ\r\njQRIAccSQgnw1XVS+z+Z1W4cZq9EWh0gAUchaeJeKvYFlzZa/9il94IBaynK\r\n0WkIjSAaZGCCGPvvG1Jsv+zScph8ZZQz3vjcdmV1EFBLQgpJRUyosVO7kE9Z\r\n41lLp4QJqgf3h/mtNt4bh+o6vD1yQhx/W1UQSEB24Vvq+FbAbYe4pmdkG5K7\r\ncnYPKTYcJwEBIPWYg1tRb1f7q/y//ILuuIo4ETPVdoKjn2PGEleOnrSZbTR6\r\nB7Xfdh5ACMEVSX+FthBYvahEvWfCxAvpgeIyqklZK7EdhrfZHYO3WsnQnwBi\r\ntzRMCiZppnEEAlgXpm/TbwDnlVkcJCDPlhub+17gvuSePri2qCKFMFd8zyOy\r\nTbK2iwfpjom22Bi8fUYeh3fowWrGpfjHgAM=\r\n=+dWv\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"c638ccc70199eff4c8cc87bbab9232d7f7857ce2","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.2_1645464977536_0.036359859678418704","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.3":{"name":"next-slicezone","version":"0.2.2-alpha.3","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.3","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"038860e77c9f11091402a9e61f8a391753ef1e47","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.3.tgz","fileCount":30,"integrity":"sha512-nIvHEIlPkIq4FrmaxJIAbizqfYadaL0S9u+Y+L3070n+zv1akW4177M0usCarvhOuTYOv6Cdkddo8TX4tnSXHA==","signatures":[{"sig":"MEYCIQD/IXcIIjch2dyTn2shvFGYgEguKeNBvzvGILf3GaXWJwIhAPujnGYA4c5+XmfSBSdUUZ9X/z1VqJ1j5vWKk6UfYbeH","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiFMTNACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo+mg/+LuZ0VvahoSEGi3XwdwnLe1mAS73ktgIZs8/pQMp6zuDhSRKJ\r\n7d1tp9bsc+gGnezg1Xo+Emx8+qhiv2viyHCF0LIqrmcDSfgvw3KgSKkkYE31\r\n9CcTFPdH6U6T+Z7vNX3h9bTKZLfz4PYX9kIRUmTtPBolb9dBDCqf4KLUPsNc\r\nL3oG3osNSaB+q51raQEJy1/L1DVUvLOlaGgtHiTTzELaIccs7h03kyL4Wiel\r\nlg5vuN2P6nr262qIJCt+XdZhbtsSgOjpnMlEB25MxfhY5/vpr4r1m8Ttj1B/\r\nxWPl0ihapuFO/WmHL0GjK2opVXxQ60D6Y5EELf5VVjfvRRdjVDEZMu6RpVHr\r\nivJRo733x14ASWArQpYDz10WUaYSU3sZFhe48hEN2rKVNvh4IgOo79ZtrvTl\r\nVB2fIKog0gJQFbAvufw01NNwKVVoM1efR77mNQ+x/sDhDcGm+wtjYI6VpNyC\r\nEMCTnisXetGe9zpn11tMttrwIOluegX7ZCtY9bi20n5CdCA1BE5OhTDnFD1A\r\n0PArprws/xzWqQ/WuXyJN9vPgpvGnhpXNnoPqrbGW+KuI30JtU7C62M8xI2e\r\n7UZKexfihGuPRBRMAgB0zPNmBC3B2LWdsY7dIAjaA3DrpT0rYpXwHzczK+Gx\r\n08NWze0JbSgfGwQ6FKNQvTIiqIzsV3BKu1Y=\r\n=YMZG\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"7b3ee0c20407fbd62faf081e8d1ce79674d1609f","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.3_1645528269456_0.8960914516539478","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.4":{"name":"next-slicezone","version":"0.2.2-alpha.4","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.4","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"7af77bed4d502cbe4dd278e057a7e78533f48118","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.4.tgz","fileCount":30,"integrity":"sha512-lLR7Dp2MNkxe1bOa9Dck6Gjc9kgmPHqlG7W5NJ0F1Itoq+d4tLMmr28WitVxbHqLusv+idri1hJ7m7aNP6BMXg==","signatures":[{"sig":"MEQCIFSnEnxCbz35y9t4EUCDNNEjPZHrxbMwB8bZ9A+r1PltAiAklZr8SnI63SM6M9KIDO3qBxhG5WBdjUrwu4Clesk/bQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiFNfrACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqXqQ//eFub+t7/vt6k5uMBwXTRyZoSt6SodpzeqqqtjidF90Olddwb\r\nxGw+04XScDP5ybzHjqPQSkNilnn+wSj59GGK1z2c6Ee0jXY+lZcqz9S8UH22\r\nyQBVeulcZcEFj6nS9Kxq6ltQBn8xu7ICuGRc5gaB/Hrfe4YWy0ks+XfJfzDJ\r\n47U09v70gtoCfFtFu3eNNxkccs2obPlw0I9Un20lHl4CllDylktgZ8PTishL\r\njqTFm4C4pEg/1fw8op3PQV+5wGM2bmu19h+xBlVnI+EfmIuc0u3l7Kfcjauh\r\n+AeF07q00Xtp+XJyOzTW6mB4Oww2wmcGd0HGmjh7tD4VW0+N24usi1xU4dUj\r\nP4maddTAoJOEkVTx7xJKprHwfM1qDPx0aCVr9m48Sepx2jdIYeeismTHvamt\r\n3GHZ0DjZ6sb+21OK4LMZtKKj+pFwMNwmW/1MdmpaZlCx97+lpgJMuSPx+i+N\r\n4nu6c0NUaXmHIK2fBRqADF2GOkEQ/7w4BqZ3Fwt4/EC0F64xKjnQWddJIs2c\r\npEleCG2lhfbho3EWh2PqXzsHWOLSO+Ru0DdtRHPHjX6owywl95hvVnc4ZLOK\r\ncz0TNV5ECXD2+3ZeIUnTVClz57st9z6W6Yf1VXMLQyArxL3uII8dKvxMjRnv\r\nB87IHpNGnARrNrQKwz9tTyFe0byEhHR+4Y4=\r\n=JK9m\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"268f36f19845f95e3646b016bfa43dae1676872d","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.4_1645533163487_0.1925421973885446","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.5":{"name":"next-slicezone","version":"0.2.2-alpha.5","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.5","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"2a9f6d171d0fc4fe84f0b52b90ca1ace1329d783","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.5.tgz","fileCount":30,"integrity":"sha512-3GCuJfyzvV0A49o9Ekm2NsSpp681whf/ZBR6SPB6VoduABX1GC4/UohWK5vwH00CYgKrSVzkiuCgOqG4tYNRhQ==","signatures":[{"sig":"MEUCIBNk+SDhEevbw77Xswvdeo/BvbbpGtIvsVSseRvQtsL0AiEAgD36YKRzxzIuGED3tXjAajgCARToaf8NE2UHS9Zntn0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiFN/XACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpSVRAAgrcXFFG6j2bYD3ApHZkFs2E5mjUTd9adpKvSNdox9BpZqvQY\r\n2w918+jYAWvwTioOLlT91K/PuXHoBiW1BwQX/pXsRnULhDCi2V9HMzw7wkFZ\r\nK2bIV7zEw60c3fKnxdZDFqLqqdWp+upLGjTelt4zNZ/6N89RB6Z5MbMnYiTQ\r\n6QDhdTodMuy8nZgpecQIz5ajs92eZXTpGdyGnRODzd1G/RSLmFZHubVu/I9m\r\n0vAaddoGRouvzlMjQbwWooT5DsZ/+nB8NFGXVu1NpguevBGR+/F0KaQtRpWo\r\npLHIzo6htUS2Wj0YTHlbChjcY6sXoMGv2kq/3T8ku2mw+Q9dW2cjWP3QNskQ\r\ntxa2h9r4+/T8RukDDo2KC57w6qY2DrzNMrtPULg74EJ6twoeGQvF61WeAlBf\r\n1TnphUEnsjXk9SMSOM6rOWg+8aH0BmapZ8rGL94YRbUddRel5BPrlxHQR9t0\r\nQ1V1e73jpYgFbRkDvNDCVBA8XspFFqXP6gwur6TGXv0odlV8aN+n1GgMo+Id\r\nM8LXisyREFpkipPemY/CVIRjqW3N0B4YOcYC44QM5F5OSrraSizZIv3KQUPS\r\noiBGKrYFn7KV7HPTgIraHoCtteQ7WWVCnZvvzrzj2QW77E4viH6G/KNHueYx\r\nZfHe88/iRlCNa8tyEDauVLfWLFYJYWv1DgM=\r\n=vhA0\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"239462f6ad67d5bdad97c2ef05916d4f36153d0d","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.5_1645535190913_0.2614041684203685","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.6":{"name":"next-slicezone","version":"0.2.2-alpha.6","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.6","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"f4e60dda62bd552b24989a4827773210aced488c","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.6.tgz","fileCount":30,"integrity":"sha512-WJjupp6wDmLIAnYZS94H2tqlKTsjKJM89pxvVxN9ObKKsTxcmQ/L/NmhUxo+y80ldlzx818cvH+VSUfmpLz9gQ==","signatures":[{"sig":"MEYCIQDR6Ek9d+ugNojZ4WwTuEeLD4KFSr5BjdPiyW4fhItvlwIhAOTBbVCPuWdjtX99QWPwVqDAlmJnhZv/eDXKWkT5gyt9","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiFPWmACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqB3RAAkxr5AkHm2FWgnD6hzXNGpYRjhCBGpnKiUg7Vm1hZUPw8gVHm\r\nEZCdg9flHoW6nMqsXZLhS5RvXKXYB1ufJJ8BfnEUf/LYBexWR8ayBL9K3h4B\r\n/ZNPqzLFvLMAALrhZsfIqh9rwnlsxtYZkpws4/D8hQMtW8z926Ha+4k8gYMm\r\n+guaLSGZ7Xi/OouARTGO9m2eZSoRYc2A5AmFmioKnUY+AjjfeazAXZDNUNTQ\r\nEWzxIL5MvcPw8BaLZ8m9keDiv4zKdAzdAf4H2vUnlx7nTAIvItKceK+jItwz\r\nbEhY7X+Mu0GvUf99ntZAEM+EqId+Tul//Mv211SgoBbOAjm3VymnkWDCO8Ix\r\nLl6BZIN2ofnkV3C01Ynr1ZXioot0yRHz+JWLNAxETKhG+6am5lNBqS6okg33\r\nHWyk+PG9Y9XTcfb50dWD7TzfLSreSu7a8DB9XamquTE62FE4tFuqSEnAtYUA\r\n+/dknk9Opjt7uNlE0lsX4XhhT7yXrUk6aJTL/gDvnTEwCy8hS/gjXD/HVUgB\r\nQAUVqUCM4SJQ6gVmXS5SEVG3zwFLCqZb9e5Ivdl8Z5m9+RjTCWsqmWpngKuG\r\n4p3CtcU/EdDXy3WTf2bq4aI+E2GC8zX48EthlOrdMnDmzq9ssnJ3QlbzTCNi\r\nvji91pWtWJtNt7aaTERGsISF6SUhsVSPpWw=\r\n=mNeH\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"f4878dcf89e40fdfed521cc3370782fb854de5b1","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.6_1645540774040_0.7483499882130846","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.7":{"name":"next-slicezone","version":"0.2.2-alpha.7","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.7","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"446d46e418f0330b816b9806a27bf58dc23a35c3","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.7.tgz","fileCount":30,"integrity":"sha512-m9j6OEbRQhNNDTLn++i60T9T7MqFdRVgTs/ztc535bSspVAcUm4U9VBsyg07ECFDbIRNUEkW/kN8douYt3g1Fw==","signatures":[{"sig":"MEYCIQCYkaTFEl4BoNGJq38lMbqD80Nf0ooKxHMg6Pep19zvxAIhAIZdUtvrpjoItcEPK1Y7jA6/3PVwdHnSIkPi+j0iOX6W","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiFQP4ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq6YA//ZQoxyYyCeiNDz9nuiqAFSaQtTLI9k5Tug1ZDLgI6kKgZifnQ\r\nXhlLH+O8SST0PLMR1iY0Bt2JZkaq2s6Zs/cI2cg1NFsAkxEJhO+bUMBP3LAs\r\ntZ4umQjisdewj8JS55iG2BTPyW3vcrWCbyRdhLqAv6J5zdV4O25/F0kbHyjf\r\nVGLEUMjzH++DtDfT32nH5X70qcRQ5kEQEoYo3QhXOrUCyD0X4m1OPEQiZCSi\r\n8ECbdptmlIKh4igzGOqYTN2k7Y6rlRjkrnk06ynkuIgMjQnM3XSQIV/Y9unl\r\n3aQvar9Fxr4YA3dbHh7EqbezMQQa063mCr0pEt29U9Zt+tGLkCZ1eOgCSqkZ\r\ncRh8qQmm4AOn6Q2MyvHS5oanQNkMlbotLX9TaF9fRlZEgATucygR96yYsbXb\r\nKDm/53MFKHQwMT+QfvZ7TPdA0tZsWPqQRNCbeMPcaOhV3rNKzke4KhgYl369\r\nCMLqTaLaq4b5ubAaYmkWjxYO0uPORlqQwfWO8NZ9Vy31RenAlIShEXFgz9UT\r\nZHb2WrF5Pw/dxm/CzM0CyuHS2GZ5is6t73tGyKeLoCED4/6/ItPe06piej6c\r\nziU6SyfqmrV4T20w5+HhoXX2ikED7Xdk9JQm/KfMI/x1mRYxKBa5KNP2w6vk\r\nzURv1NBD8Sq2FXoI3lruv0jvODyO9nQyQNI=\r\n=f6jr\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"5dceec068f70f71d238a28df33e099918df44f7e","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.7_1645544440190_0.5697072446348448","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.8":{"name":"next-slicezone","version":"0.2.2-alpha.8","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.8","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"7b573f07aafcb02d86e30c62d6378183354d9d8a","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.8.tgz","fileCount":30,"integrity":"sha512-rADopBFpaRe9xUztVK9HffNEVby00QLeaqbDKC0yK13qjf+HP//q14hBw5fC99wQw2erapb/O3sTOIw/S7g+/w==","signatures":[{"sig":"MEQCIFA6RzBRM9xfM/oXVN+RhZGPI5ciJ4Act9AiLNj6+etNAiA0IEHoSOstldEx9VV1U6VHeJxZVqZUdXTU4djDMCjJjw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiFQh/ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpXkA/+N1zzXaYtWmifAT2cfilmlflP5DLT/4OF+KaN9vGeijQ7RDE0\r\nUtaxrkJY1I3O8+wuI8xf6N9AJpvKHGyypEgRAbh1rSEsZhBT7ybswUR1w3+p\r\nZf9rUo1908TeCacxvjHr5HNRaOBIEsB9E4G0bmWNcuzjAKonM90QwHuLxT8E\r\nB08BmbBaY34lFSaP5FKYzfCKkrMWCHCWdFKeronaaG29KOnBdgfkJ8LuYPB7\r\n+3TZm5hMS8N7sqC8HsHTKroCUZONXql/1/lGAhsUR4/cuBNhuluAZzBhr5QP\r\nQ3FCHzOTcNt6SgLPjVWi6AZdheNOZZUpzfK4PmNc/rXgEodNWbsXxid5qjV+\r\nbzOHsF2eR1JPFux3tS3r6yjg4KEgICSX2BInPm4wzp3HAmwhsMXfuqTPWDXr\r\npMTQNyzXXXMJmi6uQIUm5WrCCy2vPi3UdZqdosj+tYKDuLB77vRb/0uSdze0\r\ny+slxkZ+lUXvnqNnt37+YZhLAOa/d2Rw+QS1KkOZfkWxOKVmOQYsdDPf3AGj\r\n+B0aey9ucerP2aDZ5MIwEv8GWboJBajWBw3BHLd+2plHfqRuzXhz8X1TxFSk\r\nUOmFMhe5ZAwsZM9fyQPCXBm4ikXmYR3bHo1k8NMMWQLUNw8jPBW/942gq0Og\r\n08IPr0frk8t9gTLkEXoJEKkgx8cgbueoab8=\r\n=iqF4\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"94e52ed9a8c19f3aaf3515711f103502b5311c48","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.8_1645545599401_0.43790601123402584","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.9":{"name":"next-slicezone","version":"0.2.2-alpha.9","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.9","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"34da050274ff6062c2cf5d25ef78cde11956884e","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.9.tgz","fileCount":30,"integrity":"sha512-nlERXi6FfEVSN4uKeMTuIuzc4oTyplnr7KcD9NMuHwvxl7M4MvtZZKIEluaBfT5ClsU4i9i6rlBYEV4GAZ8OUw==","signatures":[{"sig":"MEQCIEhhgDWze9aHdkwVHixEZ7jCyVXpyo0ttui+L9eW1s+yAiBoT3Ir7qzw9s7yR9KtvZ4nXqejLUZ9Tz3d9Bwu08TSTw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiFRkNACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmoxmg//YJiZCpbQUkxshds5Nh6ZWx17OwrJikiqnFfajv6AzzZefBCs\r\ncR1f8Aj7Zbv68QvV/rY5GJ9ztO6WkNknUj4CRxaWG+09mUDDVv+IEelGv2O0\r\nFs9c19nvsqQoxtRYfl+uryxi1etO+fbf5j6xJ5Hdpk1jsxuuBoW4mV48rpRS\r\nUnx11ttIgsOOWc1nBNDU6ZeF1bTQ0+UF5+UChwy2C5fUVIqe57uGhZqsBVXY\r\nRBKmIB4tX3EldK8Fyl8o3taA+CfwBw1rVTSpI4wHBns8qkXrsrcFFyfzAcbO\r\nC5V103j9mmFP1eMWztnO/Q48Ogre3N+zwMfWVAZv3StfBAdKtBP2/qUiWMD2\r\n4YcZLDsp+AAPh1fBlGl8v+cHxbUubSEkEJ7P6mjN/DBaQL/p5BwOdgCasBJd\r\nIJIdvWJWp52iOD/2fMU7SPC4LB22li1HcytGHjr4qO5JyaV8mEZWQkFE2fwM\r\nlNBB6PjwKGVGXuff9AckESAgZWIhTKmwi5kvfp2d89Fs1P2oaT4FTi83eALy\r\nSbCl6mZjNLJ0gLWZimhT9S8B9ZMl2bt+4z/KE4ACgI7Y+RSUABMZ3Yl7PQIO\r\nkOt4wurMCTat2QbX81/DL3UzwtPFX4ntEGhWO/nbm3LI5wrjuTwWKBZG0nIV\r\nBIngYDzkVEVnrrqpMhz43/2622vKCZbfiGI=\r\n=7fdV\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"3adf1104815cf20cf7b7c7169baa9b079cb3fa1a","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.9_1645549837183_0.9682587423739633","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.10":{"name":"next-slicezone","version":"0.2.2-alpha.10","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.10","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"9a06b7525da6a305d8781133d7342cb207f22ac5","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.10.tgz","fileCount":30,"integrity":"sha512-kERdMBOIx+mLvkbSnnDQI8N+3Z2D9DiyQuHc5ZmDB2leA3ZFCEgoNKxV4L7yJgGxQGFmtF9cpms2P+GJnHMpkg==","signatures":[{"sig":"MEUCIAdOIcEW5vrMf70DTgYtIQynzLUMlzgYgF74CHtCg375AiEAgzC1ffBS33H1fGZTvVHuZwl4UB8N7T9JxGHKs2lkSuc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiFgx5ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpf8A//fl9uEWman7rRbi06a0YTd5h5M87VlwIdXGWm6oAubYI21kqd\r\n672oG5ZEpp1Lkwc0kXrglVnk09zy7FX2yY7D0WTMfAFQvHqKWyB0ewjwkf/B\r\nazvqEGw3+fklN2bLdQ2c9dtTgt6HpPUV6qudv//E5ztES0ZbxltwOMqXMmDH\r\n+kq1NJ/JFi3BaCBLgUanwOP4X1AbgLISw/wPXJV7CNPAsIHc/3hOeEHkcjQ8\r\n4JUrtkWNLdV87AQkLFF0d8xxy95NOZ2eYw1NhfDZfojIt4PQRXP6DfzoDmkZ\r\nBPytLtNsUkkAhqfHxuSTJk+4BOPWF39Eh6dt2N7ot/owqeO0E7fL9/Cbvhge\r\nQojLDt1p3S2ZAmWKcUcdmRk/0pkDcZE5GaXa7i9lYC9H7Kos5bQjI5pKXaYn\r\nqVjjRSKrBCP9aqQlIOmC57NdD2MVVkfTOXLM6anzhMBuAuc/MIK+uABTUeDR\r\n91M30iLZHgVaK1Xak2sqYYKVJzmlS+sPmbUUGpzhn9Qcmc4UVqhNVy4nDmaj\r\n8S49yeF/HxzVZOFcTdHdUn+719BFe9p98Y4VqiU6adftGV/gTMyX3g++YU9G\r\nrLibGbmFLF/yZ3mqrO6rI4vsm/oZ3px/foxp33OL2GH77K5uGk0QqhSnesPT\r\n+JmSZUBNpg5FDhYBdeCpSOSDvU5l/SOLABQ=\r\n=3AQd\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"697121593e98e7fa685bb832f738779c2dda75df","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.10_1645612152945_0.783389922125248","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.11":{"name":"next-slicezone","version":"0.2.2-alpha.11","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.11","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"c3810dbfd0c43d7cd50a84a2874b4d0665e11fd1","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.11.tgz","fileCount":30,"integrity":"sha512-4RIrKqvuYyiLLmexyT0y3pyw//8spsc2cm7jCQp+aCTUfgnSYaUAJIgSjYgFKsxtce4ToR76XhACux7UK/9sAw==","signatures":[{"sig":"MEQCIEmVn0GAGhbs6nbjTs46VgqeQrStTCnzt7RLK8SLt4IuAiAs1zPMuzed4bOa4iNgK2fpMTtIF6Jsk93SLAAMhP74gA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiFne2ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr/uRAAkjJB48tJiEs4FROXSt52fesjdF6aiT8V0gs3MRYRoT9TPcmM\r\neMfdpMDvnMYamT/+pxvYHqfazXZsavG4Nutrx2WNYUwGWZeTmfQzpQHA94yU\r\niYMjwUK859LsZYXNgSErK9joht5GSs5JT9IzvDZ5VuBzQfXSYdAof8pWmIUV\r\nMt4kYITElMsS0uXtVHYo8QmLa1rGz4Lc2vR1q34ZmbEMfWD3BzBpau8g2At3\r\nhQJESMOESIJPqarywqKyDuMzMwQEkIlPp6FrVML5eL0G6BNT7VXMa7rXxRAt\r\na9+1QwHhhoDdaHbX7bjnRpZUuyV5l5Ay3kXLyiLO9kcJtmk/mv1iVqFhJKys\r\nFx3gj8b6VuwWdN+bGHOLrC36msTMsaKOIo3RBLJMERg5CvPSqPqgmximfaDL\r\nqgBctuoEBHUfcnlWF7QC70mnAoAZVTWW3IL2tWNnZBDFeQIkHGAmY7TLMPvH\r\ntvfkD3I4O8imtXSXP/my2KsL05P11DOV4C0KodXP9g1kBhJBMJXjhnsPTyxL\r\nxCXv5kP/QXvEozsYC28Ss4nDwpha0A0IETM/OEbDcox1TW+bhpyAtyisMDm3\r\nDRIBMSQNaRKe1xC8PDSQvr7pcr8kH5mJq8zDdfJAOydk3q0zIXb7kUVwnFWu\r\ndmMYeRG4AewBEWo3hvh98tzT7kSG3zYkFKs=\r\n=3+ZR\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"557f3c05eb5bf2b2e30ec5652dd11fb159e544d6","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.11_1645639606201_0.2612013144965184","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.12":{"name":"next-slicezone","version":"0.2.2-alpha.12","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.12","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"6d17323ca80107a04d041068193fc01c76d1950d","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.12.tgz","fileCount":30,"integrity":"sha512-VTgcylkOWlMbRKNqYet16jgMPcxa4kvbdE3mr7NDeZo0dHKzuZqMkVA2Ps+b6bQ1gk0l8l+E1A586KjLroq3VA==","signatures":[{"sig":"MEQCIE63WZ/6X65XtvWbMDsA8QdccgqDEqfGuuDxkDtkjgA8AiAZEYDX81sKhGMwnHLQkEQ9oMN1XWBl9vG9Z5PskC9TCA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiF1UnACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqo1g/7BavlTmwlx9Jft3zhdvIswBaLwcyaH5+5jKquP3ezYltFVB5Q\r\n5AijYwCfSpNS191fgwm+PR6ASKEcDIQA6EMbgRiE39El9UB5mUi/KkrhAipe\r\nh6g8ICTdcz9In+qwv1oNmx8PoF66KG2OR0woT0ybCDukklUk+Vm0BzPdiVX+\r\n2uTPblkzbCBkm24G6Ylj/qd0NAA1VKLA6h9aczv4j59RzK65CWS82wlOoxTM\r\ngFhAjUdVl66I51FsuRMCLrS+sAhPtoxUjwOKsddFkrdv/7OPfo8g7tSMlchV\r\ncJqqYUOkBk7G0uozGJXWUOhatR+sjYRXzDrOBLV98fQ14ku4LF0Oh+1Hhd/v\r\n3B0tBwRuXIkqmP0wZL/itLOPyPIxch9aSkbfiUFZ+rk+8WxHf+fMemyANcjo\r\nyTJ0VIfiEcvaO7XNT/BZAL0YgxZOym1tQmkN5c6hqZKNZh+hWiLAxKyyiRu+\r\nMVBuX0/IJeLkEbSqR9h97D9v16CtIRd58CI08nJHasmEjF4Qr2gg/xNTs+LH\r\nJ11Lx6WNxz4Rp1wn+kizcvK8jevrrcJduoJbCwpXD6HlqAq6DU5MuzGT1Qgt\r\nv8ABuSPegXWfMkOVBy1d9QJjZ3ppkbdCJfZUvaETh4pWXRVkzwWyRhaWFexs\r\n6gZEs2Itukgl407w7O3ssdd83OSvEBQnBYY=\r\n=u6sQ\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"b0dd49aefcb774cfe834cfe2dfda3f1902f5571d","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.12_1645696295263_0.838214656544648","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.13":{"name":"next-slicezone","version":"0.2.2-alpha.13","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.13","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"bf227ee1797299a827691fb98bd0a5c5410ca607","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.13.tgz","fileCount":30,"integrity":"sha512-v4tj10dcs0RTvUQMkKBF4gKWWY4xUIkOTubQkkS8QYyyZdBK/wRefN1CxXRW+AGrrIVcEd+UQToAldMM9ka4tQ==","signatures":[{"sig":"MEQCIGza2Yze+wPREnEckOCZFDcpyt7LVvqRI0YVmrhFrT/YAiAToPuTyFSvsaCtIEBpnTCysNgRVOZCGR0BFo75aITuvA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiF1xZACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrglA//X2evixra+CANhDMjsTlIq6UvfVHK/SJzRokOCLDeMW4GWPNe\r\nLGiySCe2cfgk3iz4NvZ2BZUnoP0az8rsWBxDdYWmnNVctDlvE02c/qPeGN5p\r\nNMhoMjhZAznEWqk0y/rBEnf6b1GT9buGHhnl1aBEEBPvhhalNNoEod1HkCuo\r\nYz2oJgO/pqpEw2pMFwHBUXNAlhPCWpGdgiLq7SUDBNPgr/ofyvizufI6jl9n\r\ns7PdLb2BUjeVTpYAIBTJ2x5cE/WBdktYT7+fu5bsJzocg+N8DuJUiVuyZCy8\r\nIn7c3gFZKC1XjrywP4lPr7coXct0XqAoUVdoYX5Yu9GhQg9V+yia66Nq1g9H\r\nqRO4loI91qAWYm9CjMkcOZXnc9+nLTehAKf9NYiWSZP7eVmsMjHJK9s/NFnd\r\n9eBA8hdhyq0j9xslf23bvPWyzdsdzql+3WbYFY5ABqWIgazUD6rVFn2B15qj\r\nUbcZ+50gdNqu1aFcEhPhUzPRgxVaUmPXjlZ/zGbtb+Pw9855PMXLPjWogqPx\r\nInZ5u2qvJvtEFhE+1RILnyGG0jeqtW51bhvteTDoNTYPAW2o3ZfdMjLY2f6P\r\nhB4icmpOq1zfr071Fn024s8H5JFhf1v4DoG+bT8fYdi3QXia4A1Gaj/HYYUg\r\n+s8+5mCq9P/0RKyQB9c26Ud9P6gE8DwBsV8=\r\n=SC3i\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"f64e51e8bf7d0866aa0bffd54c5648f39db0a5ef","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.13_1645698137621_0.3437888557755213","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.14":{"name":"next-slicezone","version":"0.2.2-alpha.14","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.14","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d19e7383fb65b906c7f30e1807d035df86371dd9","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.14.tgz","fileCount":30,"integrity":"sha512-iSJj6RAzY2wIYzBs0NhNv44OhkdO8c1gyyFnMeA16/v62zDjbjkRI0lwidofDaoKhhCTm4fcrNUrlQtPOdZyNA==","signatures":[{"sig":"MEUCIBy1Ci8GHlJM4oV6E0o20ORpfMGPnmGEvdLEtuXPHLOYAiEAzRJ8y6rzLZzyg699IcSMZxJsyZpPdDoTlh2+7lWrwQY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiF4nRACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp1Lg//bZDgbOAroK2+TVPS7lEOJJmlKhnW5iVR2mAZjjAYRxOjxL6y\r\ncEM4Li/LeYqXtKCr6RAcoWxKi5IURjCln2xU+6EPUVKNlvEwQ6T/MEYZRX0Q\r\nzl3IpatqLjCwosgaiOgb/jAOdRq1U+62t+MvFHhlYh81ifHm60gO53W1Y27t\r\n2yBgEd2sm1BYQkW5GBPJATEUKtPY9hLFmlydHLgjE6B7S+QW30u/66sWHAer\r\n8M5qDDeJCM9sfrlZtnHbTL7E3dS3W+Gu0blvSQA2DbdeMHFC6zQ7P78+LYgw\r\n+TWJ8YyrOh+pfHvlybdOTS8zMlZ1HXPb9hhli2JKQao1tRm2s585hNeUr92z\r\nINmeFDUdC2zD2M+WHrfyJi/c82pXqpbZ5CaAPY3sz167h30SUOiloi/QJvBm\r\na7jPja8ZdDW0UEq+rlO0uSXL2I6aMy3SPBbd6UmYMSJIYH1cdE3U3ygkKSKx\r\nbUSvt4fIeFDZVEi9proqr7VCvvGB2IBokPKe+zrxhhejPZzUGADUw0EkDdM9\r\npOhtR5WixjL5jeQBfFsGqDsHPPPQVvKWy0AJuyOUhMErLImq4Lux0jepm3mI\r\nBYpk+N1MRbqGh/Be6mODYmu9PnXcZyMNcRJffrr6Wsz5hv2FcXXklya1qBdd\r\nwiq9i1qIMO4ThBTXtiKRGSibOLgu9FStZ9k=\r\n=B/9M\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"43510a80cb1c57d536fc2e217684aa4317fc83cc","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.14_1645709777599_0.45798390272606904","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.15":{"name":"next-slicezone","version":"0.2.2-alpha.15","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.15","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"089fb021e67d3622213f4088aa96316e06630bda","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.15.tgz","fileCount":30,"integrity":"sha512-yE9ajr3Chu+pCPuamc6vXUDKOYUW5VHTX1oTacqA/lpm46axiSZ3yN+Gytlm4bDyshJJpC6DwWQBlyzp+Y43ow==","signatures":[{"sig":"MEUCIDBxHt+QygN6c12NSWAMR5EiYrGgWMYhGrGw+WfIJ5bpAiEA/UUawgvtrmdTBr3S20e/J9Ws4etvz/dunQt2q97hgEM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiGPd2ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmroWA/+Mhjg1QxrIZy1GAMzLGqmbqXEzLakquhH6a+4PADCwEssY0f7\r\nAam6KTNGeepfi3OeGhKD764SvZlogdJSU2QVOUfDOM7HD1up+9RJM6zbcIm+\r\nUtplIZ08MCxDDTdbgCakqJ9S2GS8rhFpUSUV3XWyzj16yVdQxUtlm6YcoL1b\r\n5nKxzef/hV3FioXZ0e4bdye2rQG+Hw0eTsuej4y2sDjOQBnlw5eMZDAs7xlT\r\naZBrej2k5DnoUYusPmQq4yCtBN0PtASOdM4AT6f06RYgW40+J2tYlECiPIDj\r\nZOTgH1FDFtVawvZ0WFUOii2hPy6icIT3AkcMyZ7ZbQfxaZn9ZxyV8b6tnf/P\r\nJ1DYFV02f/0ZGeGANFcZ8DlrUcI/ckrS2Bx/DhXv2e3zYAbKQ+gc6o26nG8t\r\nQ8Xzo0X6d6F0qHjOe7Lg9PYPrOxjjYsMv89smqxm6nwT6WpoGVZUxI6Pf8B5\r\n4l6QLoUMfPoy6Tw/ZTyNv6MhRmOUeXc2xkbkqAbZTzig60aBfSlzrl/clzK0\r\n4pKFZrbLddCb57wUEvyQji8sWGTiU27wVjkeTiXQwoDs339ow9d5VHUS9lgX\r\nyUYn2GowBTWjKpMnARe8JRCWt6Y92wmE6d6Q1ry1TkPVp86JjF1crqnVyBdF\r\nmD7QhrGmXOMPNxOhmHyYnQjDTT5TqZYhQkU=\r\n=wCnY\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"636c764dd16679e1313502ae52c1e085b6dabcdf","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.15_1645803382424_0.8177312571753965","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.16":{"name":"next-slicezone","version":"0.2.2-alpha.16","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.16","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"3e7ebe3801ccdf2ee12b649bbc9e4feb6a52ea28","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.16.tgz","fileCount":30,"integrity":"sha512-YvOiZ7a/d9AynxYJO8vjHOZTrYqazSC5c8DO+EbYioHm/6Vk4vI2KHpGrUAWTYFU2TDq8ED9zXUqC6nvCDeQjg==","signatures":[{"sig":"MEYCIQCfSAX2zGYDzOJQK+qNHdWWJr8TYt/8lfLp38vLWemUbgIhAJvgZMAIk/2FZvnra0JyKpEOE/FqZ5/1kvPqeBz2zcVn","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiGQiUACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpjSg//dyWA98s3G7y6iaafmrFHJSwnuqH0DOWqQzsld5LxifSQEtTO\r\njnycae93XY8+/c0N0mqGE0yBpzMLvpdnCn6NfHKxqWPD2u7lwKFQdQ65eeiH\r\nZ3PhSZPKVQ7As6TOIjSAaXwTRvtZgmUDdI8ZeEspNdmUwl6hv1tjXdV6Am88\r\nedmi8cQb/Cn1p9G9XRSSw2RAFirwlf1H09iK3XdZtEF8uA/WsbnflBvhqVEh\r\nTD1AyYqJ8uI+pI5EJt5Y1s+gKg/Ls22OvNcib9TpVMAwaeNjFaVraCz88n02\r\n/gNl9/R90srchfVh7Rf8nm7v8//eBGLAagH6mrn1P8jzZUuRXoX+EFuHPtfh\r\nyd0k7QMTVY0tVGG6hN/wrhICsIuyP14MKO4NrEfLrCBEz0AtPmYG8pwVVq+Y\r\nWHoKY5/7Y49aj7kxxFwv/lkQ5Vuz67DJP3MCWsR2aWu96PBvCMm7e8WWvUjO\r\noiDGEOZRq5EL6hPN8Gi9mtZshXPfBrmQuInx7WBfyKDVdb3HovSNSD8cSNMp\r\npOfwmSLMn8cL4jOFt807n8rJZsb45NsmeE1QCQwY7G9E5D5GX781lV0suzAG\r\nwOzZjyY+xtr+vDo5uzZAoMcvYlL3ffVfFq4yfRWirove0/SZSrexsB6Kwxs0\r\ny3kkjQrvwjss+XfaPsV25fw8FnMe6CCaXfk=\r\n=yD5a\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"d2a77b44b3e5f1cb63eca6b5fda3d5fbebaa20ce","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.16_1645807764466_0.6127879006462682","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.17":{"name":"next-slicezone","version":"0.2.2-alpha.17","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.17","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d86125ba0e0446433c7202059c03157dd4ecb35b","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.17.tgz","fileCount":30,"integrity":"sha512-6S1jgd1L3ytfZ2s5O4DAqjI9egJLyvCmZ5X0ZIXfx/ehPkkNYkuxK8ww4XiS0BwZ+a/NQs4P0LEqUaqfjMPinQ==","signatures":[{"sig":"MEUCIQChxLk7oUaceq4boruo32Ws/UB8rI+8FOfKlJY9z+aKnwIgMwiyutJlIxSJ4COl9eBS1ey2a3GG9WsCOzewDpsw+/8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiHPHCACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpV5xAAjc+OWTybpuoyvx3p3ynsw9jQuGrmSSu0LlURTPLX1B1nuWq+\r\nTQe+M8aELEl9kpRqWRc1v2YQKYMh10vUz9zclpHqehMd5N/2V8PW9SrPqfqu\r\nuTfD4z/z4rAz6HPNbHc7qUFcrvYNhnbO70GOyPRGV4/Fsb9k0meSsn29wxW8\r\nFdxP1TOZBcRP28BZ4jZF1AD+AT3P47esDBA5iLBiN+2mHeCja2Vsnnj9h2tW\r\nNUNmGCrNVbHTpAKNMkkgBJIlysI0ozI/csKTxy+0NJS+eD7ZdAl+/baNeZuO\r\nQYebcBlWp0wRzfvm72dQcDFGI+VJmB8zk742EhK5eg+7me+xu3+ww2wjDMTE\r\nRO/6zL+Ie9aWqNVYM6pD3ieFNa812XBW9yHBppz1DXFtylFk77QJ/xIMCaDX\r\n/m8gYvDb7T8HrMBdQPCqW2ouZ3OqKBPVRldVPfZcM+XzGVJZOntuR6AiGDyr\r\neUuGTOJjzvtgCp0Ba5yeB4tarGsI9MxhEv1lVt56id1YDwjFeXljdXyj90Q5\r\n3x3Pi86PyXm6D88qZq0A2TSSfpqdodrGVyaOPEwJdCLKSBTyefrMvgPEZID7\r\n0bp0ojuUApiMWcdn9JXNtl+QILWhcCE99qU7ZVZv4i96gfGHl2FRVPbcBsMx\r\ng1bgLZDee+QCmNUinEawe3GJ0TsrgY02Az0=\r\n=n0A3\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"0118adddb027e8d912356846ec30a404e6a5f136","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.17_1646064066334_0.4006764074841116","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.18":{"name":"next-slicezone","version":"0.2.2-alpha.18","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.18","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"92af002504dc253163b8294cdacc44357a0a52c7","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.18.tgz","fileCount":30,"integrity":"sha512-UjePgQtiXWhOubuSwToeOKsDpq2NCiSHrz+oBzjrsHx9wNspgvrDV+rVblf0MhJf8ynhUXkAQPThDixeLUnSPQ==","signatures":[{"sig":"MEUCIGgBkkP5rwmx10qdp1C/663a2094fQPiAZBZuZ6imjPNAiEA0yX8STRudWqDpT2ErUGTm5o6s0X764+/G9Gh50BVyrA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiHP8QACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrlKA//aWGF1BbIYTqCQKEUMh55ivCd61q2L0Hp80t6J+rzg6w/BTSi\r\ndlT2s2K8rPQObYj+jc6fjdoEMXZYQ2QRB1RXT5n9SnoMfARhOsLsBZkxlBLD\r\nnZcFkciwedBSeYzYB7lV81z0V8muyzy8cSF0Gre7StkznMIxl/T6Hxu/+k8z\r\nvtrllKcMzS++lDnlSUwmhwOSU4/hqxb/lSAJ3M4u1x6M9nhialt8A65lQ5u5\r\n4safx4KyW4WyePKLn4bbjpnhOAL2Vpf3W5wSs9fnkrQJAxb9RVt6aMACGbY6\r\nmfdQk0n4jFnugaBH31kThsQgjDpYkhd1vEUMgHGxFgE70wEwvU0mwEfeTbuB\r\nuH/3NLGwAg1oZC/w8I3YYFy25ftAQBKO/G8dvAmy5jHQQSbRo4DBfkuXfiP1\r\nWLwYbZMBcEQTEFShP2d8K1b0ol9ceaAU6KXFy8R6pk9EoGnQdFAQCqDzXflh\r\nJuNOxqWunQQlalWrtzNOZXEWuS3IBoDeWnD9vX37xq2JEA8Fn6EgDaXNYTDo\r\nZDc6ddLly8FRuQoVBtkg+Yo75vjopI1ygtMRkhR1o1ne0FdqUJo3pG3LVk2g\r\nleQxUOqOr6bd8tjftwL+mmPpqWBE67ADuIktsDsnSvmE+kvkq8NkkfIBoKZt\r\ndXazo1geYM5vMRJ+a+5desF8NRm+ND6W4WQ=\r\n=P/ko\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"d5a59ab7cb73f237735259d42ce7534d6f8490e9","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.18_1646067472592_0.9392334582896129","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.19":{"name":"next-slicezone","version":"0.2.2-alpha.19","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.19","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"40c3d190aae9ecfcbd027179734735d3f0026845","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.19.tgz","fileCount":30,"integrity":"sha512-PnoO4enngIgJwQc0juq1BALFwybmkzObcheVh1D0avetWVVBdff97mCOCk5Nl6c3524kFVD9SShA8k/EPQi4Sw==","signatures":[{"sig":"MEUCICSzKYItKXzeW78brSVR8SYA9jxPaAXFnPtPekDiOueCAiEAmitwnCt8SeW+svTFTV9LnoGW3uGQyDNlvoUn/ZSm3Wg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiHiq3ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrzYhAAkl9kacEmZNE5llR7JynP0nI9BMIvABt5sxmpCJVwDloDRUUI\r\nvHs0j77+Np1mWwz1XQPwcNfCSf5yyzmZAp+WdOKhanYYWtkpKy9CbcBl3v5n\r\nCtC0i8ihnppVVa6geLPurLR/spAyAzqTQdfeM4jOM43x4m5OqcRpr5O557r0\r\nj1eGc8qS83CiOFLSzIDB/pB3lpYqSoL9eg8TBEMNKa7KN3wLc1SBjJcm4uM2\r\nqP7k4r7eooTDp5Cq9cNCK9fFWQ6bw6X0y97igg9rDbrVPX+47RcIstc0QQ64\r\nY5r9n5AZLt4YQBOE+UqB8fSNx1vK59f07ZKNuiMCft1QCAYAbKXdci8H8cHB\r\nrl9ZmSB09DSTKf0MDHktukvOT3nMfR25cQHPPoak/z4MFjwlgGiftZVtpI5d\r\n/fojACVTpnrykGhQQDxixxxa7OyYw6IxEtxT+ge8bYtBstFTMUHx2R6ZfFY5\r\nxsaSyWMQIIcL0tHCb0SuqVEiNiMFQI/ezLZpahI27+FFzvLc15cJZ0PRv3J5\r\n55Yk3pJ2kF35eq0gejE6Hz4F164be3JcefcO23IepJikMFQByYhuKt7WEhQP\r\nqQp7xs7U/g2yVb4a1YaR8HrXieGpRmRbnMShnyy32W9M/23bmg4J2jn2a/bC\r\nK+c1rjE0s4B4Usn7k489kba30+fslYNdRE8=\r\n=xYmw\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"f19d7a60ea749d4ea68a5d447a700a1d66187c37","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.19_1646144183719_0.14921005163142742","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.0":{"name":"next-slicezone","version":"0.2.3-alpha.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.0","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"c124ebad75a4bf2fd087dd8c6f60953587490815","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.0.tgz","fileCount":30,"integrity":"sha512-JSOQfUIyzZl2knpZqvBNxquWF9K6T/pZ6CXQ0hIg/I5zLQ0v5TTXSoOLAdNGNYYfXVOUyy2KtLPX6ytmiFn12g==","signatures":[{"sig":"MEUCIQDXX+sWsnjMerfgWM3z9nZA/UBhMiyex00PMpF4pTXKfgIgbmeYcrajE7FHwX2Jn+ymScLVSjxvZOHcA+XMcdDshsc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiHi0hACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmrrqw/9GQhbgy3V4AOdA3ZiMa+fhhmZcgToXGHRzK/rCvdt+7cxAqqs\r\nZMJxzyShPEJ76hGzOActCT5yQOPP9ukE9DAQ+Bc2hmzz2W5rdCe0pGayBH1Q\r\nxZ1ZJyA6gpshnoOQftQ6YoyXw+G8ik+xlEql+6aUBfjezCtXqPsVsiLG0PJz\r\nFfXgMY8UPMkdFFGchBXzYWSwvq8tFpoZ/yq23tMaM+eK2JnyqQJWSadnJtJ6\r\neh5qICq5/ofibGyF23NPkuwHuvbkXYO+g++W0VbemubIRgLxrQh10pEMfqP1\r\nGNlWgyGdoceW3X8UK8YsY+JzFAa4Ehhfot4TyxluhBK0M4j5+UHbTvn1ggEn\r\nZTKtm77ymdPy8rgOdZeKE3AqVX6G/Hku+zDpqs3pBiLIIyBkunjryk+r3wi5\r\n3kX32shn8CHMdIJtp0aD9hUe2aXMmhlI1+K6FPOIae/CWlfhkqAQQShi/3ox\r\nVzQlDfMMRFcldz/hwVmEJWAyQmh8nNQ1qvNWtQXy5n2FE+j2jnVpjbv4ZTxB\r\nuPPUOInAhPfvWaxaVOLKZqquAyD9HF7VCwOYtqVp73WHi8b7fTdInBHd1f74\r\nWtJbvpbk8JERt42PfsKQURgnhIbaYkMtJnmS8ICyUBV/rm/dtZuU82WqiUip\r\nQ0Vuzm+6aJ442dr66DmqKpCAwYi6nQ+vefY=\r\n=H65Y\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"3e05d372f3aea56286ec7638463ba30ce467c506","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.0_1646144801665_0.2228363105696114","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.1":{"name":"next-slicezone","version":"0.2.3-alpha.1","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.1","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"39ae41de6afc2748731113edb181d120bf02b754","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.1.tgz","fileCount":30,"integrity":"sha512-nTJnePSKJCudGuXPyUl1HUHbj3lz9geIzTOBBYeqSjT/LiVcfbPDuZte897QWrkwWRhl3yenqbz7V8/OstCr8g==","signatures":[{"sig":"MEUCIQCGUhIFBtXzCp9Ir8Ant+DkqbLIFi58Ds2XdzAOZX3megIgHifRXWxePT6LE9J68qsOgsjqDZSwmWEcNbkK5ELwTlk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiH58TACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqwXw//WlyM4Wcrx4P6ali/mZ+RXSlcugyaQ7qSUE0HNfp+wqmUXt7y\r\nWEXA3YnPqFjwxpiLeXKRYnq7d+RgdTFr+QN7oMr+Q6H/LCx8wbnsH8qCuo5f\r\nJjed8x9QqUNED/0Q/jtLrAvDw0skcs7OmW9tqte8jHfrKqcSZdIjnwscIRUe\r\nukH/aSmAOobqVN/H9WT6RJHGqF+RAk/l6uw7l3MmAyGFA1gYWaK55sxiZeVb\r\n0Nqqodqyvkq0hP7QV9/lvf65pDx7qCxbnhWR28E8IBOpskEIY8uOziv6pecA\r\nCDRYaWD6XxEpkBt52rEwl352KZol0HmCRHop9h6cvg6zyT06LQtXMAA2GZv4\r\nRqYsIBdS6ywEXaRga+Fy+PvFc4f+9J5ccDpRQPMqrGL07FblQGPW4l+qV6bV\r\nXke5YMYNrlg0ZdMrtAFxf17q2JeuqKFVNBYgnKfmAfdOrzNapThnMVuwKbEI\r\n08CBc8myRbH+87FIOSrK0pHku9qiBA3m+CjttO+TO5pOO9NkfdzDcdBfRaP5\r\n7NwZFzSkBq9YAIdNLLeGXviHS5Df/fxt/4MpRex2E5rkPh6/0MbuXpjz9wfJ\r\nnojD07SkkoYZwKwGWVkTftVwrgtgd6TbYKIeW6ExcPpLdt6z5Qh3+jARH7ZI\r\nAlNS1mE10qouNrOCGbH2fPDn4Z4s3Yt8zyE=\r\n=tWIp\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"ec78212e5a236cf7a230c22b37bc30ee40ae0cbc","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.1_1646239507683_0.9637660550812388","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.2":{"name":"next-slicezone","version":"0.2.3-alpha.2","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.2","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"1c96381047353e82fcaa55850430481336673535","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.2.tgz","fileCount":30,"integrity":"sha512-wubUxgTegYYz1yl78QqkkCpbKzPfpHYs5Y75YjsOXR4IEWKGfoob3y2uLiy9fpUxneZ0s0nQEVbaI2uCSujSAA==","signatures":[{"sig":"MEUCICn2ev0Y5YLgwMoR8XSRlAO2f56ZLLRjm+eHRtQbTfA9AiEAkjO5Vo4udGUy2a2q1TSitMF8RarlrGWSR1GGThg70jo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiIO44ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoFBQ//Ww2kBGqoRtT9Go+GRfJ7TocPWFJGSLFGfWslKhqvu1i4MhTZ\r\nzrcaell58nHNXF4LhV0Y0cknijSr1WQ2O1j0hngyCVrBE2/mYxjhZLnUAUaD\r\nXf1VYMRXJdPxncwVHz7jbFecfkkQqag5VfqWVdj5RhGT/of6QBxb6nEwpIK+\r\nSAf1TTQXMtULPM7kPbbAS443dD9i/vMd5YuEJ3f5kme6Y7WBUuOlXBC7YtuZ\r\nlx+w9PtTmWmJpARdeIZCVzOF9thLkcFR8XPX9YvGLx5dwnBwZHoeVrhfreFV\r\no6VDWEQ8gUG1kLJHiTxUaw1H4l4ayIS7ToEXihpjG93tviax5ZPvZ2p7iF+7\r\nBlm5eFI9B2qTCL4tfde8fGNFBOpBiIdwrFYaZMM5hwlsyVuWTqM5F1L+pdCL\r\n6em/Kkr+2GCpz8eK6v5zXIcMVBTE2LIs25QJU3Lb72J/urSbR48If8b5YqKI\r\na25qAJMeE1390BDayXPt5o0bUeXu9ruTB2ivSVlbEfLSPuvC0KXc1vB6RB6A\r\nYlFDQORrWn3LR4JOtFRbQ2DNhUSaIf23c5d+Pw9W78tSK+DLwdsf2mmWW265\r\nH7TPJHoNaOC0ej7HpG3ERn9iRLH6LPr6RFyJmJD89Zqw/Eghax/9obk/3cmC\r\n6JHwuwufPAAgPu8W4GYgBX08OUQyZuOI1mo=\r\n=RhmW\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"696c3e1c45181e1450d3f42bd35b5c4739fa2bed","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.2_1646325304465_0.48975053098689103","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.20":{"name":"next-slicezone","version":"0.2.2-alpha.20","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.20","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"eb7c0351d6a2765e86feac6c413b56732fc70ac4","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.20.tgz","fileCount":30,"integrity":"sha512-IU051H6I0w3+jVWREhPqDNiECexsRwlc8pyP2e2LK+yN1y/S7YH2CDSaUo1ZPT5sYsH/86OR3yeYbGdQAniyOQ==","signatures":[{"sig":"MEUCIQCM8q4V9+XLmyehJomEyOCQXbNGXvEuL8bhaIjFxrBEFgIgX/YKW+frdvztHr5IoUwtVqt/uGrjRlYJXIUQxPqnAzw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiIPG1ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoEnw/+NZFkvCXpzRPQXWdctcjEazhiX5Uw6oGrjsn8UkO6mE9hSWEd\r\nVVyg23wZEnQ2hlTDgDREWsZCpvU6iQNvVUf0j4IurXvNCwBObw+Xs1JW+sQI\r\nxtjB7JJrFwdSlyqIlQ2vBlLjCOsZK1P8sDsBXrQWckAd77fn6BKIgAD8zjP0\r\nehhg1ZcK5OZKYV3A7qudb0RIR5i0yY5u1nGjux5nMMgOWY0bHRtE5TvN2Jue\r\n1NrAao78YHMDcX6Fj5GOilgRkcmLviJY1M7It4LLmU03fLQMkgio0Jr93Hm9\r\ndfmZBy6ehxDUeBehi7Zpoo8BfbGoBoEuCOjSDJzpFNLYbN/2jdI1ilSRV4yn\r\nrDMMrQ4LA88fUBH5G8KPbg2bKjohB97RsJkUvd8VrYJLU35RP78xvk4bo3/q\r\n/pX53SEUSb+01ukrSuwCFQFq5eFFGoXV5ajsZRDfxyirhgGKc6pzqYf68PcW\r\nwpEpp3TMkXSEHLmUE6Tir02C30XSY+LV2m9bG9D+YllHh89qd3snlIMjUAol\r\n9GrjvE+P5vKld+VJA7fY3zIxfGpSSRP6Atcdz716g598STeYANg/AYMlVrFV\r\nVP+27n0hlz+KkOKRV+21xMrop/qlf9TT0atnMo2LvItbyWZlLj+eb7Rm1Mrr\r\nMUe6FtPj3v4FOj9um10r2iFFby7FGsg2rIE=\r\n=3ihg\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"3f5bd241284cc611f31bc893086efe3feaae1c35","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1006754","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.20_1646326197145_0.05647293739223236","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.3":{"name":"next-slicezone","version":"0.2.3-alpha.3","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.3","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"556adcb5ea6368e537351e6da30a114925d3e2bd","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.3.tgz","fileCount":30,"integrity":"sha512-2S82/pEObABvXE4vnR6jTv2aOJiG5aklUBcwAyJpLaiD7x85Q6BulXSjHxoXtafVcD7VWgLEeVDOymSxbsz8cA==","signatures":[{"sig":"MEQCICXagWFp0aX6aQrZ5tY4fAyf2tJ2NRN3VAH7hZ2dNAIoAiB17ZnTm24eXeJCf5RKEOd+xQSY2A/3UVBcQXp4Di7ayg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiIiz1ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp1OA/+MRrq9P7KrT3BleLV+lYt4CkcCj+gY1SJKxLJkE2vj/X8P65T\r\nJGG2Ob6tqPY4LxM2Ll4y1m+tpNkaIxRrNQWEhj8b7yNGDaLmA3F77JS1g+WZ\r\nHYSi3fyz04RWTa2TR5x9ZdRXrE5n2WJqz84T/U5ra2sAHdRruTfidV1o3y3a\r\nviHNATjpOT8EhngcDHMRSveCkhtQLcb+lKMTT3BOsoBqZ/VokyY5wItr2dy4\r\npjAtegfDhI+Zn1IymKDfyXZXlk6oyMENh7viZ0cozlYV6ynPTp/XmYnu15g3\r\ngkm+LJmekbK0eujgrvxK/NqJ0jGSZ1mCzIXHI/c9gSZElTIQVK4RMgOpkPUn\r\nXGxjQL+jW0M26umdgM4EJGZvcQOK+PrPXI47cAXkNOhTACI/LdqW2/C+FR1M\r\nKdOcJk8enXqtmQPh+5Nf25YeRcfS+uh2OX4oE/Rkexy4eSEEQ4Xm0hWAX+Mm\r\nZlUg/5xoJ5jlHTYPfvrxL0Kh14PFnHru2p70AnGQ/ouwrNmG/wOhWSIFrlZT\r\nyjGxnpOX1wunDijrvNOWUH8qaKFnZBLMNL6NnnaIoMsopXEIGkLBJvDyfRN+\r\nFJxpgDbioTfo+CYAwB8MmpAx0hAImfV9s8aGassw5tzx2bVnSKNmYINxRozF\r\nb2SGh+xIkT4PmdpArM69bfQynH9tpo3oq70=\r\n=yDKu\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"65822e591d8c9cd4bbd8a587332881cd04c608a6","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1007554","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.3_1646406901696_0.3697688865218478","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.4":{"name":"next-slicezone","version":"0.2.3-alpha.4","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.4","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"f243e42fde3d4148403611d2d07d885ec66ee1cf","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.4.tgz","fileCount":30,"integrity":"sha512-AFXzBTIU1GFmBFesyz85GZXK9akG64YUnKua3Kkg3MFlpoxne9IrijSfewZUhNONLQb5w8MA4fX6PbJMdpv0Gw==","signatures":[{"sig":"MEUCID9p1blImuyaxKr0jYVadf7S6wxpwBruPqd/KbzMCrANAiEArt31LSoHDa/0T6gz2XgLMlpAMd7JODeSP+vMRCXuC1o=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiIj/RACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr+zw/9F6d5vQBEnYFmr3Wxz/i0XRf54HM/sHq/Um0kTGYfGXGotATJ\r\nMBH+ogXzSlcfOFVQiz5b8QsxX0pfWjFeei3kN9xIkgUswiUId6lLjNcesmkn\r\nvStsi59cjo4qPnMNMum1GdAysm7DEDMLPkLYTTGiI+2/5k37TdAD6YR4/5KL\r\n5kzzEJFTcd3lwjMR+3v0zdnyQMFub8UaSTAriBPuJda9OPYUsrZ18cQ1Rk5h\r\npkNncAnhVaoDfxzXR5wVzqYpaI4VPd39Rc64nqpB3ylK3Nkop5PZ7nN5gvMY\r\nAhP+q3O4DkUfuhfBeN0ED65/P1A+HIXAdyBiQktqW+cMTT2hjXMAkGoou5C7\r\nWZyqNiGIY+N+MffjokEqw+l/5Qx5iimAzgm5xQvdrTchqTl4hxY9/lGfj5yh\r\n4cp3zQ7aQRy+ItsI2JBbbhCOJsd2R6d4CgJxYIAUFzoGKgs8FT6ivnja8YHR\r\nuoYC0nbHGD1y27ddu1b4dzmfd8zckSmjX30LAdLeohlXzpfewLmqHEAgSYrq\r\nLkHN9Yi1iT8lY1bRIUjepI5dF1WH79n9sYD3gY51N2E9bxopHYyU+tVN5qyt\r\n70oIAAriPUTM3dYLprzE2RVEWUZXD1gjJpf9eTHi8+d10EFJFqLGcPPFYbHp\r\nfory4KyjlzYjeiFi7sJZFtzsKo6+K9dYMp8=\r\n=ZWOU\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"8bb4237fcb5721ab67d4ae01282ef50b1aaee7ef","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1007554","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.4_1646411729784_0.3643463089071737","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.5":{"name":"next-slicezone","version":"0.2.3-alpha.5","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.5","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"b63ed9bfa140407c2d6c37cad90fdbb5805259be","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.5.tgz","fileCount":30,"integrity":"sha512-e+3A0U4J9V6UpJiXm5LDxRNpUa4AFIngBXQ+bvd8PXXbtVdLVYD/WaaUafIrORaVSQBWH5hgOzSP94U3UaPHFg==","signatures":[{"sig":"MEYCIQCUzMedKmOl0SGJClapgbN2ObRBNuifP6XX9Q231RsMQQIhAM2Lcy8nLE6/8TfJ/Unc0ULfpOSi/0ENgjKek14nOTNF","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiJijDACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr/mw/8C46RSRLripqX3JFNvZ03z4C4BE7flNSMMhcQDr03DGbQVyL7\r\n58/1/Ywos7EXhElCUntqGs/C0poGHsBD2d+GYUtb/6VoXJsRoDTHQt2txGtZ\r\nsAuXJ5PiD54ZLlLkuokju9uOJViy+LlHeei+9fWjD6ahMFv0uJ0huh1veYJg\r\n5rw6tZ7rnmdjUQLj5aOTe3+2d2H6EK2zs2d9cOBPKbJtzzz5EAmlRh0rxKiJ\r\nvNfcrMkChok8QE1Jm8SXsMXR2RrxIZySay24FNNHghy8os3N1o3Hx8tB7vkl\r\nBeLKYMts6Li9D9Vwdjms32wQvORx+10vMkSmOh95leAxNi5dmy1w9I+b+L8C\r\nmJLknIUjJ+cRRIOzZzi6NGiMZyPCVsuPAADwJJJxmOd/tggTWGXVN6KnMdAX\r\nvlDxt5H58BjZrIWNjt/LtquBAp52D1nkAc9X0sPQ+LuripI3GubjDk38qmL/\r\nKjMbmYzfg8kv5bPifHeKgPHPnYeRnlRqmNkne0d04k3d7I6gNVXQSpNufAu4\r\nvacHS7c5o0rApkIKQHAOUmHoLOzSJUZmo1bokeMi6k01eEWdLbCqGzbvH0mX\r\nAbZQIiXFx4O1voK28OmIGo8wwDqltFf2nkPcUH8tcQnbXFlpWWEGz3Y6HVcE\r\n6zPtiAiMEqUCQ9UiqK8TUhP19fkjRivyYTM=\r\n=IBZd\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"a369248c4b35d9795438328866755c183f091277","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1033678","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.5_1646667971155_0.39533826023524865","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2-alpha.21":{"name":"next-slicezone","version":"0.2.2-alpha.21","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2-alpha.21","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d9a55aea8a00f99c337c9ed84158e14433ac61cf","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2-alpha.21.tgz","fileCount":30,"integrity":"sha512-pqT9M/uq7m+L0LkwaHS+ZCjz9NTbHGNP8gn3/YJ1kRIodWnquvOE6tn7qrxJZfvIxa7Un/Ml4WfwK33iHyjNbQ==","signatures":[{"sig":"MEUCIF5eTCWBx5U9dhcFrURYFg8RjnfftmaFLTI/61nwKG3NAiEAsJFNxfgeSoRI81Qezzt4svuni0ulgoEpNRhDJ+U6ohU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiJzGjACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmoj5Q//RCZF0LyIhLCDIgXAZah35Vfy9hdrGhpcf9btapHyBAnOwqNh\r\na5VbvhaJz9bruBQnhIMsXfmsb4BCHgeB5jLOl5/L2Yd/te3kPQhCeqS/dngE\r\nF4ZlxV1JTH01URXclQRZ1GUAgTp+489KhegTSLus5yjBDqrfRPdQJL8jbK1c\r\nhJL3tqfr2zuV5niXKYw2FhfdTzyM63bhEmYtMMyOeZzo+Pc+tthUQs7PN/Nc\r\nw3e3DPodRvypfX04JYV/+hQjcFHkZkd/2Tgeb0/jK4lbA1vL62qANbBhsuze\r\n5jPVFRbzM8VHu1Gn73P/TwKHpBL5sojwPo+g4GtMKuNo8c7gRVYonKf191zx\r\n4dcDEedDnLO2YjSJDVsRP88SLqcYHZ8bRJB/D47qL/ytOpAMZbxZ+ztP0tfj\r\nhDWzjoXLOoDHZ2aVEeaiqBl0RjtjSUh4cpyh+job0KakyjK5w943MrJo5mWm\r\nIq7d7Xv7HqFTCPI7aQQgunVHgSSJroUuBH6KBor0xSM3f5H7cQTCI5Yo1zzY\r\nhpIEDkI7XOG8aG69GQ6+YWbO+nEBuLZTnT8J0bi/u0jRnbfSB4WJ+Er7qnXS\r\nFw/829X1vx5Muu1oADHHO9r2xJbVGYy1BwEbFsOZfKUOO89Rwja5HRPyZ/f7\r\nmtr4sSW/9e/0KYpTjUMqQw7sv5CerAB3Rec=\r\n=zKj5\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"e6bfd5c7b686acbd24c42ef5f496aff4ab1739ed","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1038902","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2-alpha.21_1646735778931_0.24067746212332586","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.2":{"name":"next-slicezone","version":"0.2.2","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.2","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d9c8b38f783ef175d155fd573b47b95855600b4b","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.2.tgz","fileCount":30,"integrity":"sha512-+ws+dDuoTC4MKWWOpn6z5b5IDgpzY/G6MWF9gqwXXSw92mEFNzUn05B0gdSBIMebhG0DkdpGPwrhoUlcoxOLYA==","signatures":[{"sig":"MEQCIFcALKFkVj1jEJztkSG2STbWdhlwnqhREnoyMNhkSSQlAiBfP9NOG+pqIPEILVZ5iadOFfyduth3gC38zrcWz1QvfQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82879,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiJ1N7ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpCbg//UtGOtsAVxBeLHsV8cWCluODRMhfdNfXTEZLs/adkfIITY6GT\r\nitfUzSgjJXXDdnDh7MkZGXDTlefrwT8t9ebUUKFzLgd7EHCLHOd0PXMLdujm\r\nW0j+j4IqXQKY4wEYIue1vpLxCZZ53Qa2RUgqJxz/INvT5BS6Bjuvf1pxkq89\r\nUK6x0wUvaygntISP1pqUfGfoIFl1SWkqn+REEcEhivt20SJL1kQE/RKzcNAW\r\n+wOCaesMwop5cNsnrKpaDbeu1a0mZRWFoJFadG97VSrKr8Hw+RhhwCsfKhFP\r\nkNjEzg5JNKI5oFI5rdDmlIbmkmX+AAy4cAe1lpVUdHWqphmFjVi984oHbxfq\r\nwURDa5dXN5jKpBljZSKluB1B9okGgTd/KPq5hltb8sfqlGANVxI7LVX0LEqx\r\nS3JMBzCrwze88XVTX7CXSvE/pt9TLqdzqe0aTOT99wB57VffsfeGIpLwhpyi\r\nXmeBvVrMKGm/q5QlKEQoR68w8I1Mxu24UMVVj17E4avTUqnFGH3fRN9EYc8m\r\nncD+bn73PuAyeHusHRAaP5sOP+7hgA7qkBffRad/BUd3UBYo/WpekJ0Sx1Wu\r\n+6vZQn8cP2fuwilhsqA/fllhyun8khNGzhnPHM0T2XkMEEa0fFcO5tiEJlgX\r\nAb9rPgzsisvuGSxMhY68P1V/LmqE0uNT33k=\r\n=fF3N\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","source":"src/index.js","gitHead":"8e1c78e62c4861cd6525448b77bbc544eb518b79","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1038902","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"miniploum","email":"kevin.jean@prismic.io"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.8.0+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.8.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.2_1646744443085_0.24119175239393553","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.6":{"name":"next-slicezone","version":"0.2.3-alpha.6","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.6","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"969d7d8c127ffce4b483216320e12de4568bba4e","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.6.tgz","fileCount":30,"integrity":"sha512-a8CDNnF30prRskj1gFaEM1tEmWaAZPSvqwZ4wbJF6SJhsjfRzHyNkC8mEKnqzZYVPVM3tld0a023OfXhh0AINg==","signatures":[{"sig":"MEUCIQCKGf3kyTxLCxx79iMVyhEUCow56TO3cnp/MD/Fa8/6rAIgf8z7Gjs46uvIjtxeW5g2WDEDJj1AzSIsQEMW9/yphOo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiJ3e8ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrWwBAAhK82+sRlfWWm7oB4PkCoYsx/IhSyAM3yW7ireVs3TFswLjcb\r\n1IprgLn735xYdJnuLqMLYvkG9/Yac0MLwo9aVxA3xTL5QeoFjwY8e370VMAR\r\n0WzT57hlaPRYeA1syt/MTxZXOvKDDVvEsnD7irvnA33ns1L9TIObH3UVXILo\r\nbr1f0t3nPmaNFMg9DDa11UNRNASAipx9yTk9e2FBgoImGTArv7WngNV3BUPq\r\nZ7XJIT+CjPwFBfGcxodJWtGbi4R3xq5sOGcuhD4/6sDNZccLwHxCzuSMwd8T\r\nashkURAy3XcInKENFQjXhf1hrdyX/QR4XfnZQQfukJx+vyy8oUGn7jSFnrSS\r\nnFF8+u4CF2TNW0TEdNBINxu+mq70B7g6M9eN89hT02ppY5VBE3mXK9yR4DP+\r\nOEtNl67qTX0aovgKaDUFPhuyQ53s9EipQgfmTlqYH5VUC+HwpDWSbRUB9R+z\r\npd9LNFYvBeZzhou59+m5etvW1+EUbG7GMBHn7pS1Eg/9tjcurgaDDnYTqCae\r\nCYzP7BStykvpBMcQOmKf8qyyAt/2ossdV++T2JVD54Zjz9OM5RWZunWzIaEI\r\nqdrS6YTujivCoRfxr0/L8F8r1KE9W/sGACSvsOBVO1nFnISw2K1/Rzc6YXS3\r\nTrxECmDdOfOjnLRB2ONr5v31hGrL8PbhG9c=\r\n=UPyp\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"e8b321b882b045f402020401ac3f8cff29a9d08c","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1041514","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.6_1646753724085_0.9462125774520131","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.7":{"name":"next-slicezone","version":"0.2.3-alpha.7","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.7","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"ca6ca85fd119a5ce5198f7acb6019acf76d3bbcf","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.7.tgz","fileCount":30,"integrity":"sha512-oBLlqQhrqXTIYoATLAN28t26GzPR0e8UjmElPWRSjO/8ha/Xn1EaxfYbftSgQ2aQBrFPU6XKE79a/KGL1nXQFw==","signatures":[{"sig":"MEYCIQCDPQ04niZiNVIVKNAV/IDrbnBRftXOjcf4Oqc8RoCnwQIhAMDHquX9R6S8Wk7gS6Kk1Nv4E4Yjwfnx/mHMtbQjJICU","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiKLiqACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmolsxAAgWu9WqhYQrpkoNUWraJVKtjv1lDDxSwsqLW6juJeMjFSTTMg\r\nbOVtNhMtvydarfvE1ruagdBLkJvetULQGPTo6kOdSldf+eNNkzFNtiZn5+jg\r\nrKHD+OC5T1p9Jw7PnFCRyd8oIHHTZOA2EEqhbUDeqfolfsuRiX+jNaEDnCgm\r\nsOVkG/PQrJtYGNSJZmRyNbPiaMq1esuMziSxp1Zuy+jR2bh5N77E4yADlPZb\r\ndsl/axTiZGMsQgZBL4NlAkpJXB+//w9M0OhqvBB41s9R+dyxs9+g95tbq0LW\r\nO/ICp24cUYfrwscd5qnHwNpJBTJYVsVZGpk1LdBPPe4DWU2L919KKv4Yg2GD\r\nAk4tApFIkTsp7wlxd5rxN4GFIUvGwtFJdi0tTgoHn5i11f7ceTymzKAxOMtv\r\n9vrmSYbvEzkqm3QoCaN9vULumJDfJUGNHQokRzL1G+vkbVcUhCGHlN3DyREN\r\nkdgDdlkT3o1VxtAvVJ5wgfQNh2CU3VZ3oPhZ/WJPmp9g3KWPpcUB1IwLBQSj\r\nOn+B4j/8TVvdhYRfbI3T730kvxFOrX3fVPCxWC3AsAijj8wOoQOc0anTOcLF\r\nHRaLgmS2PzXAe6fmli8Di46mV95qfEKBKHPqj+tD2E2ciD/koeIFHSYb+dXN\r\nvg2+ZtnV4wZDLDYv3TBAiNfbb1kTNGEL6hQ=\r\n=f9ZC\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"01f8415ecc0beabbf8a8226864ae4c3b58916892","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1054595","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.7_1646835882729_0.0295158519897476","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.8":{"name":"next-slicezone","version":"0.2.3-alpha.8","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.8","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"a1bc76df620e55dbb5fca678f46124bd5df8bb25","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.8.tgz","fileCount":30,"integrity":"sha512-QmueSrCkD4TboidSvpRn776u5x/lEl7Ihe50DbEd+X8IV1EjO1PeaCmMLpUEQn+klfkdQkTiigujUVWg5kOINw==","signatures":[{"sig":"MEQCIDsPG0Y6Ua+IBhcfopkjNKsbtC0Lw4VshvZNQSOcO0stAiBQT3CKRNQJep9RYJemhM/yep61MNOKsMNLUSkqiixJYQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiKMBSACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp6NA/+OR5FYfpOIBn/O0TQ7NxTAB1W0WD50G/Qge/9/ZVyg7zY4v/P\r\nTXPhKCUU5Xm0+aWH4DF+Se3aHe6c0hZpiJRWhAFy/gcqeHd0NddiKoeOrBUH\r\nO0YplC4zbIPdZ7Oerx4cwL9E1LRy9qG3g/Qs7KeoWx0qgVMsg5nSBVQwTHLR\r\njC9iqJVZotst8SBQK7fwnH8XNLruDDZmZXxo/yW+MYB2OLhkoOGeA+3mfWtb\r\n9WRTKOC19HxlaNu5fDltoaaNKT4xmTBYROyWBFBYL2RgzR5ng5tW3nPhRo1m\r\nguByPIiJu0Q6uFaCzwTeqY52pAbv4yHa7qrMX+7gv9W2bUPJCzknLEbC5+lm\r\n7OV46bxBOuTrXaZjqxfkCZpwsoCV/v6ec/cTBq6DAxb15UsMtXswakmFNqo3\r\ndTO4uE1Rltvidkw0R/F9lqLgdxA9e1Zg3Er1GkGU3uX3/y4qeOOzEU5Y9Bbx\r\nSw/gMWItERtEEpd5PgiL/rXcTiCgpucgxaj7nv9qZzLcoNiwAHU5fDvY+I2h\r\neS5lA5GQbG+8cEIWIxcsw/bXrtioS5yuNwqneE+ecEkaNi2f4b69XANESuht\r\nythzM94GutWcvi6vIf31K31xW1eBwYPlSvcp86fcLaGeMTGrrR9x1dej//6t\r\nXBuYz+riwODmfn03B8P6dhmSfkql91gTwoQ=\r\n=JXvx\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"d8531c6836c79d379f7f379060d34b2ef21acaa1","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1054595","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.8_1646837842707_0.5673956599903942","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.9":{"name":"next-slicezone","version":"0.2.3-alpha.9","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.9","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"881e85c0dd39986326d04313c9f9bc353561636f","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.9.tgz","fileCount":30,"integrity":"sha512-sgfmZ077bwH+8IVvAOfnlTZUzl7CUQfuLmfHlNEmrhygNiJN/InvmLqjUAaKbYK/WBaenXHT5z0CUaVYuozF3w==","signatures":[{"sig":"MEUCIQC2U52CHSR5pJsUb4z3uUWuurPNngRTfxeE6RfQTuWOZAIgMRbqK4s/GQUTzIR+pORO79B1NIrMSZBVZ0N/dZmq0Cc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiK2iuACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr0KA/9GSU45/lRllJljSFYNjDfHPKfJb1vgforj/fN1XVauL9Cir9z\r\nOaZ3iC2USPA4In8wUGflOVGVr7czoufxT0c2I9mrPXteUgT/DpfbQ0M+gTAh\r\nFtcCS1uLX9Szk+MqFLQo8TXRDelNgChZpE/zsKpvFOOokBzp2b79Yze3pDcd\r\nWxfyL0HQLYzZunKhuwGArSWXhDPRU2L+nulGIs8M/1ZA8nesl+ekFWHslz2U\r\nM8u1z/H4kja0r7XQAbFEAYuLEIqRgyrMvx3pcVc3cLNIA6Ez8tQbIUvHv4kU\r\nCy9JFslwingTMnazltxYqZnh03C15s9hLJ2uzTqKuHRvAZXXS1lXJuxFeFnp\r\nH/pNVehiNC06r0vXd2lOLbHqEqgvaIrK3A6tll+WQBy4A5M5sPH+ZGUuQbhh\r\n8TKVq91FMzHBcEx8w1CgOSK1AIG7RHfYGkpmQAi6ZvhrJSTkYVps0DX14MiD\r\nWsVzR7D4vf9rFydF0MUTN3Y5ZmOuJsPl3PpJlcFqUPk2frszHXnBlqsnIebc\r\nusT4KqajcOGIL8qU60shk/AeGZI6fWSNt5fpJ1KBNoRmwzmYNdj1zJ5xE/0v\r\n5lhuE7E/5uWgnqJNb2f0UWl55R3UWIwMJAKS6NtruHE1nAuJhoKXoGHizPA+\r\n2G+KyaqgbEwyZ2HmVywnGsq/MfYlFoTI4aM=\r\n=cFqk\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"28aa057bde35c530eb362cc8cb2ccd6d72242729","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1065069","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.9_1647012013919_0.5580755213951178","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.10":{"name":"next-slicezone","version":"0.2.3-alpha.10","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.10","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"7b5099de95d5db8231c35bdbe4e8e4e29091cf0c","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.10.tgz","fileCount":30,"integrity":"sha512-K3OlWOBTT+dgYGP/MuHJSpR30Hm8UcdoY3s8EJRzcVXR8/nP7LNRq40luaJU7fKQQecKWSYTFOEFvExnh5nQVA==","signatures":[{"sig":"MEUCIBJqbQ3JTLSqfVjT0mdruSI6y3jObfLmxijvLPLjzme0AiEAjheoDg56F5Z0f77+wVfRxB2aHv4AFK0JuMvTy4vYxtg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiK3LLACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpk6w//dtEjUQjJ6vxDB7UdDht8Prg+950hdCNoQmtJX+kSK0MINn25\r\n828/5KsqNPhQAJ6bykL3Qpvef6ZUqemMmyE/pTOctCe11k1uze7qI4bG+7+o\r\nLVhLiJp2c7DJWkxko+Wn5rOPblRN3l31Y/d95F+Fmk0azkDGaT8JLBZcRZ+q\r\nbsQLlXExSbw9+OvDqyuz+sXdoWKd1hX7w+dyIhD7RsnDGLf8OFNPgc9jZynj\r\n3CidNhuPDPBqY+bs8Lgd6Q0Z9fGo0ariW9Y3q5flkvtGyq+2rfqmK6hOYKux\r\nTDT7n1IvDZWdpRVEJRVHbMTcpDHnGFnRzmxM0wxOsIvK0KpoBL7319J5+bva\r\nDDnSEi7OOHryPZuDIVfcde3xzHptHVSA3hRxhqXfICITPthhs9knmuasjtvh\r\ny1SzwsIHIm/7wKEUmtTcu6IS+LoCF4jOxZ4wltBiObr52JSRaUDVZfYPdg4Y\r\nGN/TJzyhqkkq5RJwDwJ52Y62KBJ6WLG62RGJecBp1YJ+8+y8ALB5fFM9r8FS\r\nFK2o1cip2CYFJzghSoTh0Yqydv5Q3kydDkLZuNOnvUOc55gAQIp4ktrsq1pi\r\nWgTY0DycqK+aeIoDFJqEYWujRoM+fCm35WI6cXC9MiZfu/FVL3UioLcRTJP/\r\nunHEoREcpP+wEyeL4gD7XcqRf+gftBqxuL8=\r\n=t3jZ\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"ce27a5de4e4e9820c1d90a353b5c1954e054c906","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1065069","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.10_1647014602911_0.5997484900767809","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.11":{"name":"next-slicezone","version":"0.2.3-alpha.11","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.11","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"540dc70128b515ce92404df7bc56383d99d28ab1","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.11.tgz","fileCount":30,"integrity":"sha512-Q03IFIRnduTt2dwZAHSqwYYKx6PBJrtgSx/scMaKJbSTKPnX7+7Rnq8qBnwT5DdBUNS4rhxGUtZuokkJB9lU8g==","signatures":[{"sig":"MEUCICK4phmHI/UhUX3G+Uq4td+NmJfoVkkqFkCLJnJSYm6dAiEAgP+6Hn+8FYJdafDuW7fVLuhOvcAh4H22eMeo2CcG7/g=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiK4KtACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoaDw//VWLRLK329MNPW+3yOEQXIErMuO+LMct1TC+xvuqJnDPqkm1A\r\nskYYabnuJAhFpCB4/yzDZqF5e1AjqgdPel3QvEI+m68h7kBpBREx7apw+RGe\r\nOYa3JtMUEn/KpU5ov02AfOxASvYDdnm2s03juhJoUMEdvz18giikx0WEovSp\r\nbeOcmtxRN8GG2YEgcMh8AVkxWgOif76zL9xdrrNoqJIBTLkDjefA/c/+qCnz\r\nIGGqkIDGsSjWpw8sUrwzsxhNTV0XZBuRsG4SYyvwBSz4VQFlL1KSxZowNx+t\r\nDr4xoSwhXQuFiwsCgRRqMVOzHhPaXGUdR+6oObh2K0q1gLauAIFCobvV8I4H\r\nL9HjS21bwrW42T+7RrA1eYJXASJfphUFPRbL1tVnzNoMwqYr2mIb/6KDs54m\r\nx5aMr8rC4L31Hz9ytQUa+FMLFiFiETfjtltodF7+1Z34MAQnEKoh2k5yJv8G\r\nqjrlRkLNjA5w2ob+pfxn4tjjxJaqXUyMOYK9VZUfCa2LPpGDXn2aiwAq9enw\r\ng3BfyNFgzlSjNLsWCf0yFya34x4GQ2esTZsjOHl9/ehyGJMxcP7iWfbbm4Eu\r\nEVbLWSlnLjSVUwaMKLSWux9ZZTyMVt69nhhqjvyQra7ADszWJCzZGxZ3hAer\r\nnbYzjMUkovbmCtXugFu6+MJm2ku4cWdt5d4=\r\n=Whri\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"4afe6b1ed473ad5eb7101938d18e6da5c83947a8","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1065069","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.11_1647018669080_0.10072571035516331","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.12":{"name":"next-slicezone","version":"0.2.3-alpha.12","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.12","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d160c81be4495645247a67e1e88a5e03e622ad0c","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.12.tgz","fileCount":30,"integrity":"sha512-HE/WTWtQB0OWoYn94VIBk5nntFKDpDS+niBoB67qM5ROaoci2FIjZkMt6d6P19k4s/QsZiMOBZl5i1vCDFLbmQ==","signatures":[{"sig":"MEQCIQC2LqVo0J/xGTBQBdmrKNJlmDAP8rarI7gq0chvlvarXwIfCfDMbKSf0sAbbiNaJGfLlmzzToUOZ6TQaP9LGWzk+A==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiMGpqACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpkZQ/+MJN/QHtDKU1PEfzfTXpOymgOwXpl9nX6ljnoR6DgKobReNFf\r\nEgcvhpe/wILR8ocL6IGRhncZFT/DQqjYpHZ3VG0r6Yakhu0uFCJr2aGRmBBK\r\nufX1vmR7AcxqSxKfLC/tk0SRHwFvbVKs9B2Unida1jB8yDh1pcL1RCbBRupo\r\nOW71d1f6Y3U+/N2eLICHEhP5FvRyWGj4U+MrfF0nYieH7f6enF8Wk+aygPwX\r\nPHOshgbikq9/RSbk3aNa2l0Mr02CQGOfRe06sNLeVC/ZhuiOhOB/drgvUmA+\r\nSs7pqSVxEWyLwfdB439TvGEFI5QvqDiOnYQCpKVblgiS53vamE+FrVCloxGG\r\nlaNXFWNV6+l+JOVRV7Mbvc7Oz7NXnhRZv9sQBYcg0qvlj4fyjslV0ZrCQBGM\r\nOD0DU32lSL/jnQzvUgOZMEpuz6nUPieEFIOm41oIUaEA49VRlcL1X6tFD7g3\r\njaRu3CcM6P37l70VQKH31gSE3USluNs48UKLHLekuwxp5mySKXGDOXo/lASC\r\nid3//h7TaPgWeXiCtWv0VGOrskfCt5GjcLr0p/kIoih9WyLVlkR5/iaMWKQR\r\nRQgQjUcdvIJT7a5Am0NpEGJZKAHYnY9I8RH3x652rlUN5uGf0XVKz3YhKRSN\r\nQIvvdVtIvlvO714wGsKwbqs9wWmDLLHOhUw=\r\n=ho++\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"d3fcb81a600bd733ec911405f35d44b562703c2f","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1065069","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.12_1647340138783_0.25411040327128087","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3-alpha.13":{"name":"next-slicezone","version":"0.2.3-alpha.13","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3-alpha.13","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"d8ff447fb0903d3dbf4ce6efa0cc353968dc6bc9","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3-alpha.13.tgz","fileCount":30,"integrity":"sha512-Ue1CIb9vCUIBGN7mg9dyx3/RUR7RTijt4+pWX9DjO9G8eCoYJ52HwfOvko1cIMAb3xnwIUmd9Nwqq2+QAlELyQ==","signatures":[{"sig":"MEQCIDH3iTNqX+k5v7q429UwPjM3LqmPoT1RFg2yLfZJ6IhAAiB0gYX359HZ/evBBzed50OPyVhm1qkXQ8PHR9KWzePnjw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiMK7rACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp3GA//TJr4FSoc3dBn1sp1O7wkfjSx+3lRAFyQTzROZKYJ3Wfu9oOI\r\n240qxRe9VpBTqI+kYzGIp2j3ix9NAstVmjaUrobvRoVb38rDFUJYp6BmG7RT\r\ncEsBH8LP9GDBaXjbKvmXUdsUlxlWoTSDwzOo+56PYND5n0+trbsEvz/vWf/T\r\n1zyYSXsO4Wju2AbjK3RzgHn0DjhDFme3xzvVHxw10DXTRwGgtHXXxztSmDfe\r\nV7B9XnvXsO97vy8DomR1udGu9AUsvFE4afTNL/q575wPDdL9DroIbH6HsBg7\r\nQNXTy73uxnhTMEkrRf92CaEj+fNWnVII3+956NdKkM2FSRqzSUJsgvn34AX5\r\nAfYLuLzTW04IXCxLXII/wCreQUL/czHZBuIfzppsTDHY8YcWi+X5MqjgeYpi\r\naf1E1E26Frh5RglBocHGKceO7cUbeyqmSHsYZuY4L5RMDdMeYh8CEWCtAG7p\r\n5ZsP7cXWM826c9D8yk4pP62HrExRZM9ItT9zW3RYtCPsouN1hpbxLuYGiQWh\r\nIUq/abT5HfvO4TXvkvnaQHlDItfacuYpz7CGd1Cu+5GEglOqnq/zH4RrvloG\r\nKgbtky+PSG6J94wnNEy4ubMhzKQv+zj20dlo2cdwfAb/FyS3rhVd256Uph+r\r\nRKs7ChCNmxw/WxbRSwINIF4pShCbl0+pvI0=\r\n=gudj\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"454e19457e9252387e8f4d08076ffd8901d2582a","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1065069","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3-alpha.13_1647357675749_0.453702364517387","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.3":{"name":"next-slicezone","version":"0.2.3","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.3","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"df45465a5de35bf5c886b6ba03f05ea679d3adfe","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.3.tgz","fileCount":31,"integrity":"sha512-wUL7Hr3l7moRmKW4O6bg22pfc7jy4m0X9uu7iYubcfcNxiosdtRXfI/pr+uDp8MDD+4Mj6FTlGxkP02kPH6+Ew==","signatures":[{"sig":"MEUCIHFv2u8V9aejWLpJvUom3Wb8EV7ib2KcbCgQEhoB09WsAiEAw2On9cX+ReIbwEZRjRq1VW9ousGu2qhi7nH0VTwrEDw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":83228,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiMeD/ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoS2w/6A8WhZSZ79YzJDQ/mgT1s9SzbyfC9zrqZ2vxlJ6mzChtHKUMe\r\nnLqQN5TA68zR31kinQp8KY8G7kpTe6X1tOHTBn9dE0NXiJTeEPz+eevWijU4\r\nkErbHJllk5yDdHji4WS6i/pSPZBIFcu1vcX46hSMePWRYTmw0V0jVMgiAFa3\r\njmt+49+zgtu8p+v6HELmKzVU2uzXitoYJKiuZ0YfyQc5DXvlo5zKjYX066LB\r\n8MFSUHcFgnjPvuB40X2EvQbB1JyVWCEX6U49Gk9le9cOkYI0tROZ/yYYcvvd\r\nJqHpEedGeB0eqY70YIEQEc7PNS6vzVNYi5sXsS36YMY7WS40KduMSi7nDzMm\r\nwN6F1j9I/IvCErb0MLbpd+5uXuGpKXDWwvj5K5uMV7RI7BBp/hMPWiBbxRbO\r\nLMSTut4DTnn/CrYHYBbCFh8SNN1PCPYyIJm2/nahjhl5ecPyfuCsAIubYx6g\r\nRF0LRYU4lTqgOVEYUmB5Zgacah6624FHXo6ze7c06QmbqPYRENItVpF2516K\r\n5lhYMC/svNCJwsaRuDpb7dgbqIwHGlMjbmpiLjXaR0F1IIxU1kGqXAhGEeFw\r\nx6uTPxICAzYGLdcUb85XRIBCvA0i3Csuj3V9wP1ofIDJy7sRrZpFjqauUX+d\r\nDWGE9SY2CDdSIursE6Bt++8UBIPKL3DhzdA=\r\n=jzkU\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"4a5d01f790b7cd59952b4f7ef3918f645aa90421","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1065069","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.3_1647436031220_0.5658498697152077","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.4-alpha.0":{"name":"next-slicezone","version":"0.2.4-alpha.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.4-alpha.0","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"57fc84b2bf775a2cdea6427c53f7f2df040906b6","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.4-alpha.0.tgz","fileCount":30,"integrity":"sha512-l7Tj3TDCMxbKCvPgHhYHyvBXkhUd2/epclMRDXuwMtyGIS1QP7aSrkQlQLuMFJssMKeIpzyNoSP8p0vKuCB8Vg==","signatures":[{"sig":"MEUCIQD8yZZ78UlI5nLWcfKUvjIApUOS9M17UCC1J+9yyFjaigIgewkH3Kqn6ZURJXdHXn76mwr+b5SQtTksupaTF9lQaBI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiMeeWACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoC5Q/8Cy2Mi8CoYFJpCpxZqJaur/OYZMdMdPE9ajUsDINtmNiv51W1\r\n3YAC6HsHSI6eqKdfHoloVAyCBSJXdYtYOOAEkv54Gqvu4Xu8Fa5QUkjNWBU4\r\nHmqu5XA9N6gMCfOy1XDYmX3drupdzeHcwkZXi6hN389vCKWcJ/gMN6YEZiVj\r\n2agbI2UGvBWyuj/FkV+AAcJbvYimZuDEtrn6T7yf+12LUal4glmonj7rnHvB\r\ndw0pUlk/+Gx2j87ViZIYgwJ2h3l5oa0/YmbfSo7PR33Bh8qgDy51Qrjc0yk2\r\ncQjXD8LHsDP7Ce6LIV/E0J+qpGQMlqzsSnqZfBxuJPJKs7DquaCOK8ctdR9y\r\nZvsO5fskbiIZ9y/Pzj2lMliX1GyhlRNWsYmHjlGJtGQ9qwsNyQEFTaa9Xgvr\r\nnxA05EtGEv5ExAg+X7s56evywU7VY6V5l993fnaqZW89wn02uE0Cn+OEQwKi\r\no2t0OECHGmEFYp0daDLR+gEIhlp40Zs+HOgsP8i36auZC5oDAEGoNtrFg+rM\r\nWDWN16zY6Cu99uo2n34aCVKtDxWfWwYP1aUZyuZ5PYTvCyrdR48k997EF4UN\r\n22bS/NRzLS51cTrbh5Mia73WstDpKItsrPJkF1VRSqCePxUadM/jkKoVzgfd\r\n9JXYCTd0ocgz3y2Wi4FHKGfsikYrmheXYFw=\r\n=bOQY\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"40b44d529f307f573c1d73177a3bdf38bd7860b0","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1065069","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.4-alpha.0_1647437717846_0.28554486630172193","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.4":{"name":"next-slicezone","version":"0.2.4","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.4","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"f3e2f2d3b7c4fbcde29c63b20bb10e86f1372dfe","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.4.tgz","fileCount":30,"integrity":"sha512-hFpttrPtsyzoZEm95f9F2eY4hip9MrvNScMpmF6ll6D93dNAc4ZzH/ij75mxrDMt3o5b2a6wRE6VURCLY5YpMA==","signatures":[{"sig":"MEYCIQCHfv5fUhhMqoG1smxJ+T073Ad7tyzKQlakdJENr08rxwIhAI+Hrj0eNgL46bt5eQl2+N1jYGINaJsABfvyCsXjKwP0","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82879,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiMe68ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqbAQ//Y3RNQ/EU6WHj5QKzIfvstMSY5UOTTt7agVtNm+4Qn/y5Eeb1\r\nC7l0E0JceQixqWOc1c5eBjSTTAq2ucZVgn/5Z5fMMkaJ8JxGaBCeSdt4m67N\r\n8W2Vhq3ghdGyB+0xrBeIb+SmlRkxYwqrR3GjirFmiyWWGbpl1NxmqNxdHdsG\r\nLIVR0rqbzWNUkQGM0S7kRklC069JY7qlh8vqVwyGpXSP/9kk3h8HwxGKjGZC\r\nTcXan3ObAtt/iUeUz7ej9vyQwk1BuWPQp7Ssr/vLTsYAjsrr41AqZ3YfhvhA\r\nJwIUPDKZbeXpaxJHBQ3XXxqdD6LyQ0PebExvvPItBF2jZx9QE1bPwCdzD90T\r\n6qyQEZsQtdQWnMTBuVvaw8jme+Fem5r4zPnw01XKhWSZhw54y/DA8g2SuCG1\r\nc+kFkfriliLqNhF9ctqNczGt+8wMNpwjagRoeo+VJNPh/0TCtXvcydqv9tVD\r\nN6ZISd0UOc/ABTWP2Jy+V/LRTgWe0L6ijFQpgtWBujnvj+wr8CbsEK23jPNj\r\nl4w2VcDAsektdGzy4UNgwI/xLoKdnz/7lNnjUwBxXj9YpohH6GwtcLBIscDS\r\nOPybyCy2u9gKUew/XI9vs2eHAhS4rTdNZQYwW9hVsOnPYEjy+DMkvN9cCzBe\r\n+adD3i3ix7CRURJqscqjO/tsm+A7cIiZJjc=\r\n=MNGT\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","source":"src/index.js","gitHead":"379f1c0e7b17c67e8bbee44f79f5b8ecbe3a559f","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1065069","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v17.3.0+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"17.3.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.4_1647439548568_0.6152093798645046","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.0":{"name":"next-slicezone","version":"0.2.5-alpha.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.0","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"5de4788bfc50256904023ba476293b4f202bb588","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.0.tgz","fileCount":30,"integrity":"sha512-iBgD6FA9dWTWwAmwt3GaCf3ynoQPnZfz/ET3mVanX/tFeo/j1R6XeMNpjxcfZm94J0LkngekC8kvsvV4HZwuTQ==","signatures":[{"sig":"MEQCICYAIZxOisH15nCZUtWPseMFvlrEkEfGRCaWderK0+gxAiAGrMZBT5ByWtM6guI2+1xhjnhuRuz4WP6fn2TVRrHCZw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiMfhkACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr0bw/+JxxcIWSXcIgn9yQy62xZlWyvarZM2sleYpWPAV5g7MYyNCr9\r\nD7MFc2xg9o1kyFiFtioQOFqFcX3iLMDM7ugOIsjnw2A2pxGz5KUDYBG8/9Fh\r\ns/0F9XBacytG3pmSWI9hygQBgPeyUycPke5BBX16eiO6yNf+4/4hwh0k75um\r\n+pN3TK+EdU5BzqzppTm4+j5A3IIlhzU5ftZTgmxXxOdUfg8n6WbDFwwPDeUc\r\nYsO73uWbVC24yahEgZPXZ4htRb9Cu65UXJmsMkY7Fz4RQiKG1r0IMMHR6S8i\r\nych1O0ELFrwlFJOEBtuqgSePXV2zeUc8humH5mADXu3OoNDe6ih5uJnQju+q\r\ntC6aKBar5evWxpomrUYXkEA/+kgJGD2tCW+m6zRNqBK+uYPCa/edeV5rgG0O\r\naXIgF7cUz+QYhH5i2Cx3PxcMMZs5ZedBa+LLWo6MvhAIqrKA2+hNxKvkM338\r\ntDOGF9pOusGtcfAvFd99CZS1Lg1tCDFA9aZCtEVD/UOBQcFZ8W4kVxzHfTyf\r\nplCxWlDI2f7tKW2H/D4DselFooUu3ztfKRHGGSPTV8yewvkQcmZW+dIDBPwH\r\n1opA5H0neyHS5jSwn+6fnhI83zbctV/o4EFYEwa+ERixH+32BdAyzbMwn41K\r\nEMnlUJg0j4cS6rDB/E+Y0F+WB8+VSm+Uoy8=\r\n=jfxL\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"a71d6caae587a3882e90aff06caaa62f6be19b1f","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1065069","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.0_1647442019884_0.9064977559252518","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.1":{"name":"next-slicezone","version":"0.2.5-alpha.1","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.1","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"ead5dd0e1056fb80597536fb87e13569a91ef095","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.1.tgz","fileCount":30,"integrity":"sha512-DGK/EaBZ+KuLFjX0E92Kb5AhlFPUaZ9+k/yc31LtZpt3Fald3CdyAfHyDO2FYDQlZKhRIRJsc7RMUCICkokjQg==","signatures":[{"sig":"MEYCIQCMgVM8ND4VLVIy6VTVhsrvBb3O0vAtqHXSEZAzQ7a/PQIhAKsVgeOWyGTtf3m1BJGOHK2O/W1f+0vFvZgt1XfOh7Qy","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiM3RSACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmoq0xAAj4bncZcDwWj2tYZ8/qSMeFCv3WHAz2/0Pu7AowNETM/HVpfr\r\nZUDdzTDcyX5TAyNkUIANyt6/NycYpEHD8VgVn5Mh9BHgP6f/Q0P1JQ8giNiV\r\nu64qcZDGMbOZLXmnBkxtoKuidysVvqKbBbHQO0VVuh56qoRZEgdcK0JvYuMt\r\nUZGF3DMB/ResRh/GnaT3Jug7sCL9hW/OQxsPK+GiQsHz6y08gd2dmkUk7jD0\r\nh3vgWbUTeeP914VwApRkSBveZlrdz55jucdqJRnOAcY6R+DL4ope4EDrUk0O\r\nqbICQp2t1dv097Twu7Zvc6/AVx0H0GAR2LQuDl1py9Sg5jtDZ3ATolbnJ5uL\r\nbWvOaeyz2wlBmmb/4DI0xuitevbok370IwqEk8RlbtWEziAX0fwDp7S7lSg4\r\ndG70dD7kWttEaFwPglsb6Ab4NAlc8cRGW4aRkt++6mdFST+48FBoxH415P0b\r\nvcn7tfdxynNqJ9mZgBvwsVrUbzWYFt+8T8ynIUARpTqNReroLSrl5JBsRHCC\r\nkHq4B/T22By8B6ZQovImXxL8ckRmzx0UH6gWB4FC3IkhcU50eZ/UoR4NXdTE\r\nsQ4eq8mBsB1cxr0Urfv/nkBAMrSfQqWlXyCzTSYgGGqinxAiBNlUIka0CJd8\r\n07eKCBB44Ux7UOiTTklBgetTEmWVPcvheHQ=\r\n=yHc+\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"aaa323d4203ad9a967d2624708cb40044276307d","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1065069","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.1_1647539282809_0.251496301181082","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.2":{"name":"next-slicezone","version":"0.2.5-alpha.2","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.2","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"e885b739ae8ca0d449f6558024fa6fa23d4647d6","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.2.tgz","fileCount":30,"integrity":"sha512-iTzNli3ugRM01aDEUNK0R7d6qJih0673LlHu9Uyfd/T4ZMqsMv6BC7lxkKvre6SFGK1ljHR/5YH/dUw1ie4cLw==","signatures":[{"sig":"MEUCIQD+wGTLIBb8Bi7vuKAa4sevDouqdmkjP6Bc3nDBmIM9ewIgHK/b3HFiva7dgttepNMZz6TNF6/p2xSXHhqMF4/Y37U=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiNLBiACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpPtw/5AW2Qs/VVWTHCVqiEE4bN88o+sYGXnXR8wMKX5tZVPcsyF1Jt\r\nSfqu/oblFvH3M+R1KzqpbjgErtwRJEAcu+P3tDNyLouo+lHs4k30hjlbZKeC\r\ncNcVXciO7oYfER8l9/6gBm0bYCqdPtM+8VuLopu+RZ3woYkOKUDtxkCZYPe3\r\nqZmr4CbmvzQAZfM2Cm9bwQyKYl7tpNu3v+WtzgisvouLSY5J5JCVwP7F8nga\r\nkzmhj5VLQ1fb+PVgQAnkcrgwPo5+BtdBf98dXOtfRCPHYGPBDy84Mu9vnp6O\r\nk8mHRvdyBAbP6xPohKZyja0h3NDSdNyWMRFAwr7TqpC8fNDGdj+xzpJg5ri/\r\nSYVcfZfQlJO6rQqE4stUpfzL2ebO7959zVvBdgdnp+xQr43a/etRdfjb81Wd\r\n/Z+ETwakn3rzto6t/+OrA+llfJ6TqmbFYK6ZBsqd5b/EAg85ASXFogDhuP+G\r\nk3NtQ2LydNHXKCTBhVgwM3x2vzSzkUqq8Ukqp0DWWm0sh/RgzdzoflwIlMmX\r\nDYzrY1kbHI6U+49er0eannWjemkB6xozU727dK5PV+CNWBe2NltRg4dIRRA4\r\nyRbR4ra+DS+uDGZwFSerZyNdv8gPmbVJ6b0L0Pe31uXdN9w5hPadeeS90ffs\r\nqL1uOOrEEMZI+xoGzi7yw6gcjdJLS3SOiHI=\r\n=Deqs\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"fe7b2cdaaca691ff0b5d3ee22d2c663069a60ab0","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p -x 1065069","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"^0.0.21"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.2_1647620194447_0.029757703057287754","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.3":{"name":"next-slicezone","version":"0.2.5-alpha.3","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.3","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"cea7c17eb5bfb30f99b6b83393cbe5ffffb9933b","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.3.tgz","fileCount":30,"integrity":"sha512-i5t8z1lR+CfqPZAP+t+O/GDZfF67nPjpYitOBYVGM6IEcWNNPaacXGfybDlqQtJAv+EYBNwmBYjq2o48j8PV4g==","signatures":[{"sig":"MEUCIQCOzm/iVydqxEgMywNgqp5aTu77aeIVqQH/78bsJPHdkgIgfPidRjtHZ1DSGMJgOeDfPqIJ1khglgdLrMmQJEzdF6c=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiOv0QACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoLtQ/7BBXFhiGHE7K6MeYkb6o5M1EkW5b7yq5E/Yxpp9PJeKSQK2D/\r\n6zbMG5rRcPaNEGvkbtECBJtyVYNRjzJ+Vq5Iqcv/cL+MavJSA1jHLSC4blmo\r\nUY2jaLdzkCrjNOuE9LWHo1hTU91vOGdGZgYRf2WChJnZxSBJuncLohs/PVhn\r\nEM1tzb8eZ06dhK5qgmBQgjW1TxWtAb4byY6qp351+9xWkehpUC6f0sRQ0cCw\r\npIgVQ3zzUQGR6V4EkMELHqbvbUyzPJSK25BMmnXsFIK/BSB7dhGky5hN6plX\r\nmVIylwtAZvHT1Hpnx8sKgK4q4AAT2Z1xRToflr9hHxOQTB5dL7d+jeHzYYrn\r\nNqSonr6KGrDB8L/cMhnl/J13pJgyxgwATFH86ZZ91XcPws/WYDcZN7Gs4+Ie\r\nqspK0O83gmIsUaWZItwNRhmi99mBrlzuKVWZxd2t0Mo+/kAQBFLmqw+oX66y\r\nMBu3YKnnDcSactw2+Vw4J4VFQNVt9XXvBB/pxn24AF6FziSkJCBqXZefpsDr\r\nTo4o1/jCoi+/S+HXLXcm1UOmUBfE3i1xDzW5eRrlPJlhF5Ew/CguvgmFwcxN\r\nZoreJaEPVdF6TDKzD/F6JQL632daxvq/OIgvCpEd91l8QYHfbaFN5N8+23Qd\r\nLyy9kZqZapjOkOrsylRcLcSNKRqDJAnrVp8=\r\n=CWnP\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"b71b524101f4dff9420aeafc5c8145dda7077f5e","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.5-alpha.3"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.3_1648033040775_0.8996541065218586","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.4":{"name":"next-slicezone","version":"0.2.5-alpha.4","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.4","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"1e036a52a7438d44a5083b164ebbf77eaa22ea44","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.4.tgz","fileCount":30,"integrity":"sha512-+3Cgicynct7aChWZ7WM1sZGdttlWjNoe0D7hy+a+mwMKtJJfKahmZcyzI29t+RHYOk8SbSPP6H0A8TWefxI7rw==","signatures":[{"sig":"MEYCIQDq8qy4hTp5Yt0DMwp19KSo5W6mtdudLVRIXeiPp7AHOwIhAJfiAqHcsEzXMGE+oKg50ipmIf2tnzgt+NiQzWDYsL/G","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiOwF+ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqQww/+PWSyNAp6qinCLhgnrZF7+a97Dq6MAthax0UzBT4bXC8IRbej\r\n6RdDXETzqdhCgo/4cFk18nOTrbeWExTcIJd4/lBAD8K1Rnf0+NK8lAqGU6wE\r\nFnbJqoR1DrwgNAyRRJxwfRIDcYtkC3bZc1OlrNJ6KYwRKopdNAPb5SvPHq6A\r\nkMpFVOBelNO662fxv1Zny75MB59HdMiNe76w+xLN6T+34clcMWT5SHUSGz51\r\nuEDxcG52G13nrT0NwmX3cerHIdCLOuLuikzqqPYGCd9zDew/mBn/kU3MDW8U\r\nHdHf/FsolGSQmK9xJAGe7KmmxzHt/PPEIqqQb9wQoaHnl2lgEj5w/GviJFJU\r\nFoQj4MIqRW7Gu1rWVKRFQmFUGYxAGlhGYs9rOH2zRlzJ7QQyUPH/WWCTBT1F\r\nq0TeGdr1xjTEtNgpj/LWVgoPBHOKA/9w583caJcItiP9QnA9QWIJOPk9n/AQ\r\nLcXP37alPaHuQAK2CWSG/8CyNM1bLnPrI7OVMAR5nJIUfk0LU0kaL5rK7OjG\r\nF2FREBP/FazVejR6gVA/N17Xk+/R1KA4NV3+xEn5ddZBAkTznvtBoql9dGCM\r\nwTxjdDiLOT/A5ScMn43TECJcskE37u5YFZhoNkEoFXTsvq4Bo7WzTA4NxnrC\r\nGmLTgfUT2Byr/YuBMZ8UdaINXZyqVxC8/bo=\r\n=Gmzg\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"78523a3a47fae314441b0f6592f46831ae810f1b","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.5-alpha.4"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.4_1648034174613_0.4847963062340639","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.5":{"name":"next-slicezone","version":"0.2.5-alpha.5","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.5","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"33086e55628ae4b5c234e841b18a4f5f6480c65e","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.5.tgz","fileCount":30,"integrity":"sha512-2s/ard1GcBZG/DfcsjWxEHduI8hl/K+CPWnh/C5CPO5Skq4rQKWih102HxHPzSG1Le9B+mx2hj9ghS5sUT3KXQ==","signatures":[{"sig":"MEYCIQDoljCyr2GRiteMOVBi5Fiqr2zRFf2V/KPxDilfEqSUkgIhAJ32snu3wMwbDmFbqfl0+UeGw5Sn0BxQOYQcD8fhdBLs","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiPZyxACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo9Jg//Trf9ASfnGWai7zxcPQjgcFUSNX8Aj19dmQp0ovYQ8c6hTA+z\r\nx2IhmvRxko7K2zcbhRtfl4asJpcj1jhEzWYaeAMa3LemmytpwXcdQ1VUKrbL\r\n+ZipALOWB6MpihvjeKWlnwgwxSr6CTpC3e8LodCz/WjSv58SI5f19LOfV3CL\r\nvm00lFem7Y8hu8kuDJ9AFXUsS+EVL5GR2yFOQPdILitPEEju1TcUonROTaBQ\r\nTO7mQiLHx+fLYsxKiw9oN8uvvYLPhLzUxww08mZ2xqoNeIeaknvfQpATHrcc\r\nqowgu4vkbF9oarphRg+C4jTQKScEGgD7v5iDFLBfKNMKRSYpL0FxaNf58eyn\r\nGoFqJDbIsuPJosPi1WLxjlk4dhqhOh5SZqMl64pIhrAmpXg8KCyejo8xT779\r\nBvVhS8WEF0OoBFOKi6h0YODBURqEjW6CJNXISw2GVpNEiJ9ftXWvAymTx0h1\r\nNcz/xBosuejZv6APSwBKAuPn0OI9ANkd/r0OFtE8+kleiKQDzIRCgQPP9ssI\r\nZH6uPqwL1+7ceULbcVYasBIci7UGDAAzPHdLx4bUX+YTeVbmGTpXUvThyhE0\r\nUuVAfBLmxDi1Tviv4LqZ7F3LDb/1S81GLimA/DSpeWV8lVcyl3TsnCQFTJs7\r\nFRrQQ23yyST4Ti/MiBDH0PcYZHvkZiBo1NQ=\r\n=Z1uN\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"9845918ece6aacf3edcd52cc7f0c9c45009b037a","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.5-alpha.5"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.5_1648204977092_0.19958362046718725","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.6":{"name":"next-slicezone","version":"0.2.5-alpha.6","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.6","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"fbeac203652f0ae9eda9042ad5d0be5ed76940c0","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.6.tgz","fileCount":30,"integrity":"sha512-NDkYRqYVOfvnvE/N8c1OkpmjXS3SVLP4tjxrOlD5/ljGuOT2pr4Ie933C/YDRWAqgKZ7qc3ziWn9BcpgtwZA8A==","signatures":[{"sig":"MEQCID4eCmhB5y+pUswnJ1Up+UsWEt1s/orNaFzx1ZfBdoGkAiA/0cJuyI0uOIatD/lt01o5Ol/xLCIR4e737cI15nwD7g==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiPcXuACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqexQ//ZzqiLUq0x3pKLVQEAHZDWqEF/FH5WbbQ4BWTK8xtOKGvPFFp\r\ndknXt8xGkBF/2hd26GzlBY5jrzj/fMomQnvFy/1szGII5b/+qwPpYH2Kik8x\r\nN7vU8kGZHMiTytCvwIWdC7z3SZBLN3dYej4Mny3UL/0kXijnu9qBbN0Xe+I5\r\nKsYWPVz0JfgexilYXPOnjWSfbnmhUsNR3pwKhUR48e1afn4bh9VYTd1Qoefe\r\nq9yEl8Ws60In31M2X2CZG8PLIXeBzspQdhYuMwrlYYZU2GUgVi6ZWciQW+0V\r\nCInDew4oOYtSjSK+gAAKE77AtAaNEHiLq+ukeLyAsUo0f8GTWIWMtHcrkaBO\r\n2cETEsZpAjkoGst+wWwaj03eyCncr4+PLqyEsJY5Yq4VGfCRup+oK8NnWTMx\r\nps0rZKe/fV6ti2I7Jk18DrHiNJgvPjLCLjyl7RFbaWAyjjVlW/FdO/mA2MnJ\r\ni66GEX9UxKsTduPefrP+8jDAF5FLpbxmDFiK4s/OWHWAV8BFN6aRvwomhomL\r\ncjC15t4q6TbJ4pDKqNiurkEC58JiLtNUoPtQddosQ/ofdT1bqefjrQAT63rZ\r\n1a8/PuS223FPV2MY+PbyIq6aEXN+C9HoQDHHOsmyOspbaRT1f2/O6LM67mLQ\r\njYqUvj/xiNU97x0KnZSuCwDMRBZ3NuyPbfU=\r\n=FBS+\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"93a3ccfc00726a87c35a3316b1e0dcae5e9e825b","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.5-alpha.6"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.6_1648215534843_0.6068447676807847","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.7":{"name":"next-slicezone","version":"0.2.5-alpha.7","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.7","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"b09f2b3bc35ec0858604c12a05c507220dbb4fec","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.7.tgz","fileCount":30,"integrity":"sha512-XYSUVy75D+NJYUBNpTqHTFBsNM2Qf9gMUkfBcjG1TYv2LhXsCrQ0fGRwArLnSRXRJoIvcWZKq7HUjt6czRyu4g==","signatures":[{"sig":"MEYCIQDpLtpNXShqAHi8IvfJW28Moe+b22d+ZZjj/BUJUJquIgIhAPnCgGsZfYN16PDWO+8QKG78K14+zZF9aeEw0Nv3ASSe","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiPet8ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrzAg//bdRgD8BoyxVejZ987O50hcCsoEsWq125rBR8Us+H+6gybuRp\r\n6NzV/uqo44DW5RK/x59Rl5YBl2OnaXAYZJZjeih1sSzDN3NeCh0VxXo21gF6\r\nTNtr+km8xa0zY0jKRZaDNoDnZsaDofrqJxoLfkikzu3f9xIYkIZbkx/64LCy\r\noiXKbOUmtoEkf9bivZN4meMUHUb0POZbd192LQqM3LtVgYVqvTd4plhDPW2q\r\nRhADUaVGPa673/QY1AwFiy2uBMzpdw/+xZgflTX6SdP47jFtqPJQ0XjIjXbx\r\n4xWyc/BgoC8QXmC/3uVKQetNp7d/2uzK7fI0VCsVvBMSUP42VWk/FHJQ5OZc\r\nHQYF41/O2pEnyvNyHm4EBG8gG98wpnMmcAYg/8b9RL0Gx6ZgnH9BQ03ZAXcO\r\n7jc+Yz87lZIlXYtCfQF6J7bRzOajLsZZCcdCQu3g8+clSC1C7QNvhU91wCy7\r\nsWXjC11U3GIkzp5GtSQrOfKWH6usk6XTvoX4cNWGV6esf0CHbeJFL+oyBK7v\r\nX9u8oVVlz9T9UJPixHvHAezBHomPOQ1ZWIq9mxki9pQrm72Orx4IoMwzgyPs\r\nmB4bkqj0DWk7ZclO/DfwJUr+kb86WECWy+LrPVUQ/nVYGs2XzDffyxgg3gUR\r\nmdMeFlaWaHzw2vT3yyXmJnxGuy9fzvvkkTQ=\r\n=Zmwe\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"25dc7d5d05e8f56d5edd971b25a93b2afad7b765","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.5-alpha.7"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.7_1648225147974_0.630748853955915","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.9":{"name":"next-slicezone","version":"0.2.5-alpha.9","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.9","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"757ad8e88814ffc9fd0eb9cc9aa3fd883fdf3c54","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.9.tgz","fileCount":30,"integrity":"sha512-qoDQtlSM9GyOgNBwnDh11Q4wcv2Xrz+GrAUF5B+IBMvN+8ncDRIl+S1g41WWdEhYeBnHPiBkN9/z6adoIbgQNw==","signatures":[{"sig":"MEUCIQDO5p5Z+RRPNLy/tcrvlkJRFB9XeE1mI5x+PC+alCV+KQIgCRNXuJEnv0Y+siVrL7K2brmyRg2WNLOiwgzq7Pjig5g=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiQxb6ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqJmw/8Dp0M5gvGpp0VNip0TQycgFQMupHHeUJy7myDTZHj+jPHSyN6\r\no08n8SUT0H9I49mGVvqr6q4qVuAHcK/WG1teduxH0GYxzjgoj0JmqfbsP20h\r\ncVhZNljC8sye2rN0+a7Zw30RpJuNrUY7F9wvwUtQ/QC/m/4pBcFTzONJqeNK\r\na5QmkX6N2VuqOsNESjogY7mVrAwMUCW1F+BJEpG/O3BAsjB2PIL2ILU3kOhi\r\nzw+ZmKN8vqU7BysJKkBazSFiNw8QhC4X7jsUw8EPT5fUzSvxDnPMA0AGWuYi\r\nEOnIyC3iMK0pHi9pHwI94f+vznBYF6DqzXWqwmsn1ItIcf3kta84/7ke6Cqp\r\nl1a7hJsMOiRiAOWUDbYnDidr0CG48mN6wHb5zFKrP8ePOnnDox7HA3Z4tML9\r\nec/UBatPdsRjDGpqsnqg2t41nzVoEHkhYskzO6JWX2PJmsaZtrY+SSIX0WHy\r\n+K+WYGKfK/90EXWU9Taqsb863fsWtz4FYd8id1yQWgPLvaq0kViUcWMU2OCN\r\nEzYaevUZiDzUn+voCJw1XwVdYTqZhkJ7QTBF11jgrHOxjTdqiXJKPB+6Hs0H\r\nyauRDRCv3Gm9JfbN9FjTG8CBzHw5hi/7ZjQapgQKnYeshaJrS53Ny2zNE8dF\r\nS8+nt8QQK3+0vV1RCAExxsdKsDX/201HDys=\r\n=jUcN\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"25b1690702b8be726a38de0b96bc26d1b30295cc","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.5-alpha.9"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.9_1648563961880_0.2796815512484454","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.10":{"name":"next-slicezone","version":"0.2.5-alpha.10","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.10","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"c44ca4cacfe90ae73324c3d746d0ac6ff414d082","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.10.tgz","fileCount":30,"integrity":"sha512-+9ofiFCZ3GbUCYxlwlBnBCs7zGWz8Z3ppNnmofDnkT1hGFd56E7L+R96Httoh6RgDXE/IT/1uyX3UOmkHS7UQg==","signatures":[{"sig":"MEYCIQDUtleboxrPoAevFtoKXaZkB090syX/ge7GGSvKbKQO2QIhANSbAahp5SzZSAsj88rOmODhOEomqw+7xzvcCKuhj5Wz","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82848,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiQySyACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrWBg/8CKEn/6jpWPhJo1o8e81WDvR/BI1CmwisKdYwQxgmyJXOTNk0\r\nofpMGxtbJ0F5PIw70wAOCD3Z8ZLtk4VRQ9Vzd8OATxzTcqDJiKdZcmAQ1z9l\r\nWQ5SsnxjlilxOmMjHIIoaIkEHIXgxP5WfhnPfELpjLPcQGp98u7hF2k3dHTf\r\nHh4XPrP7Z4H98Bq/F93U78fHjWovJgLGgCC+2qwKqjb/uW8YmUwN2vsu8xQo\r\nIj5ybFcI5CFv7Zn9GINxg9pisq+wV9DCQkeR1AyIlPJ+e3a2eW5iWi6hCexc\r\nPzZgZR+lort081y5vzr7yoKY9ZQO9DFqSU7RzSWIAgoSil+hUUNlfetno/fJ\r\n6brWkM6xzgLO74KsoMkmog8nolbM4M7gW5G4E5ASyIddeNP7oNt3e8f3B4x7\r\nPzdKSjiEYmwHuUXKPuJGhSSp3ZvYxqEdY8ayhyBAauckplFwrtRtvN7GGZmn\r\nufRGBc2FukrTYJN9UF7pTTWW0O2L8kFkTRDlI4mraDI8Wn6sqVX+gkuny2ze\r\n6xdgZ1JBz7U50w+YYfmI/F3o0VC1pXdYYzz7poI2Yiqkz9dC5W0A3drEm4iE\r\nsClH3uGRsDFhFVpxfY6WTFYlJXmatJddIiw95tiamVshr4FAbBEbA3RNwLKp\r\nZTVJefhExIIscjRajpcC/m29P2BbEAyue2A=\r\n=/uz9\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"c5ba4fd9ddb3a902191248f16b1d53410eea883a","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.5-alpha.10"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.10_1648567473929_0.6062963096874832","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.11":{"name":"next-slicezone","version":"0.2.5-alpha.11","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.11","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"21d3dbce501da4abde30ede2d3092966eb12ce6d","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.11.tgz","fileCount":30,"integrity":"sha512-5bMpmVeBIbJH9Jzxq+QTZWFT2xu1lTJ/BsKN5GEvcNo6m1HNprKv+LKJkyMiI9ErnO4XBYM7YnQ7j2jxCKPOcw==","signatures":[{"sig":"MEUCIQCUZPgkQ6C29RenH2vcXEq2L9A9sFOn/ZoelGt2U22MHwIgGXV1eF9P2h4FIAsfHA/EF620kTQaQgzXd8lne375FwA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82848,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRCIwACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp+pQ/9Hfa2d994xv3feFzn9HWoIl/4Z0YH0EDXm7pEkPKxUQLMMPlu\r\n+Aos8oGembPmuhSUoUn7PFgtRXBnV4BP7lTfvJXh+PEQRjLQm689IBJlf0yM\r\nMQ+ZLFtmmsHUaNXA1zRnb74qrvzAiEvYSKJbWNnD9QC7/hlOYqtIIe5UGbc1\r\n35Fsc0Ajnh+sENCymwsA507M/QM2NFViqduY4xhPY7HGz4+5Mpo1RWFwgkjd\r\nbVdXd4DKaekvoDiiba8rFKA8MGvQivRCXG0fvt6cG2K9GYF5fNR5IjvtV6NG\r\nOp72zKRtztVGELw/Lavqm86URDZgvLo9sF3cye4D5Dp5XOI40X+fL85w1+mk\r\nZCdlIh0iR+qsYU8SUfUfdbre1UmHnX8NzHEP2Vt+bnA7RFRM3NCjyBcUCsco\r\n/cA7s7u0SNAwtH1gSi9woCJaePbn5v6JYcd8sheZPiSzh1NfzDZjKTDAuvKX\r\nw5PzYy7A7yFkUtfetqQavw4PaiM9KWPO7kglj7pYiamXnIkdoS6xnN7giruX\r\neP4nCjHtoEJ7eNkDMS6JcwEMrvtScE7oXy5ccbTFqc8ACBVExfJXo7SLioBk\r\nSAojbhX0XfPn7aSftJXEPgqCKXnW4MlFoG1Z1g3dokSuWGUnQmGeO5zBtT05\r\nAH+4wiRvUOfZIta27Pr9m9DtX/UYw3scpUI=\r\n=v0dv\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"ea9df274d7c9ecf265d2c0de33e42913eacf8718","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.5-alpha.11"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.11_1648632368677_0.9470572601198377","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5-alpha.12":{"name":"next-slicezone","version":"0.2.5-alpha.12","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5-alpha.12","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"6afbf1537c59137935e10978c3c7420ea8807c81","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5-alpha.12.tgz","fileCount":30,"integrity":"sha512-9wGRTL0tYHlvsX25oKObSHrpUGXlnxJGg5W6texcSDRTbroBWOUnH6DvhOJicLhRcG68/6VOaxRTjMZS27AiKA==","signatures":[{"sig":"MEUCIARqXP+nKU1GurQw0NslrYdgSFpFT99oupt/nngAHn9vAiEAyvW/3l6VrElzg9rbCbbrU2/vwpZ+wNFGjzO1FI6Ze3k=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82848,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRClWACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpoiA//RlWeUz+ZONapi6kqt+q/lruI62lkIcR2ZpuBQ/PyXa2dODiJ\r\nudoY13Nl5zgp6q8eU86dIwGEqL4kVZTF6YiVljk5D9p1OAUqFnOtCuQ1MFh+\r\n7ILnfffNuDlIJMRpJcQE0yBtPwmMe/SHK0ghixea5z4EkWSLV50CXVw+lNbB\r\nKevSkEV/E7qgF1VRxfw/MvOLU9B5kZBvBxPM/pxx9Ivtz4OSbrSsG5pXtvgW\r\nYk8tPKXjlupOupImCrCkNM4XhSlqOk3tUDzjx1anggVxKnW86pd1Qu3gnhY+\r\nSIDoTKodXz74kt4vFh4a0CvqP5EqQbjzsOiPuThYHdW4FtDQfXf03v9lLKB2\r\nBeRpPBTDB1YwKRfQoYgFtqLGxx1cgKsez4yVdP9qevUs4u1B7hb5BncwrNaJ\r\nYDH2JMbfxxlCaUEb3Qce/XfOed7zT+jVm7UE18fUJ3t/MUZSlhBRYta/Nvh8\r\nFalnFpIXHVk8XLVdi81lGk4+tygespieGIflQ/bSBsZ/W/R5BWNVuSBh9oa3\r\n+7UlwIUWoGuRljP3CQSbsdnDmmiqS1D43/ountiFDK1LdteDy7hShxdzHWqk\r\nb7Aps4fl1XxOJes4X+I0UWaTKevKS77obPbkNbn5TX77yuT8O1tkv3abz7jf\r\nkZVVEtvIgLc2PEa7xHBzLC2sVcRzjRB/EC0=\r\n=coMc\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"1839151e41d7dd57d764a34e562eba3120ad0063","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.5-alpha.12"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5-alpha.12_1648634198369_0.5077528477705964","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.5":{"name":"next-slicezone","version":"0.2.5","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.5","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"miniploum","email":"kevin.jean@prismic.io"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"ccc4682091c900efb2f249a91802817b8db8c922","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.5.tgz","fileCount":30,"integrity":"sha512-UbkfPN1PS/Q7zIFG+PgBC1AtA73AkQ0D1iPTqJZmK5odcapPYwcqNN/GEIetMXnn4i2v/guzul+fZHaxkKSGFw==","signatures":[{"sig":"MEQCIHDmoVPdZXncqiDOdg27xo6o/qS7Eqsb4FV1NG1Y3I5EAiAWwnI95xzBnemerKLcy7x77tzHqhgDlZ1Y+N46n8TbEw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82830,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRGLrACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoPEw/9EW1G/1+OCj+o+PRpPb3uD5AlKrX17+yzIUnAn/pPMDSD3r79\r\noC9EU5g+VC5SFiDAP7Bbzd+yHl83+qCuQhXz1Y8+Ogl4qgub6ItF9PO06KEH\r\n79Yq5XtpqNX34ZXiWtdt7EEEgvOj6Emj+4VtMeBv78DNrAZAZ0g2FPQxb/RG\r\nBy1M7X0bcxwynfRj41mJUNjAt2209NpJLk0jQFFzsnjfwV5NHd7donnjnRZL\r\nOl9eGnfS8Zh61YcfuyBbhiCC7b+si3+kl5wF6X2Mqn9w4cY5LoMMUv2/c3i1\r\n3eIr7OLwMtLc2drB836Dc5xLpFMHwJsCC5BALDnsCxbKZVb091mCWghKNb5h\r\nwMsoIKvIdJ1/mU7IGW72kIT/7/k43N0hC5AhFDDcUCreUQxQcKWFlykkpaWz\r\n8pl32PJU1/z4ANpLqbG50VRIt+P5rNPzKq8pSadGFLTMf2XWchTeYc71qLrJ\r\nfWkrDC6ZSKtcdhkMHiMPWXNPwEnqII4r2JjgqJyiklKzlziTKcOAulTQkmEX\r\nxUvN7T9PCsQEteSR2LckFx7KyzhXSo/5JzYSX5yjC+8ea5rR+Y2MobEKuy8/\r\njPNHLiXsd6Qyf/lIiCvhDlaG+VeXSq2GdIRAYve23Sec25nqPEOREw1+1rbg\r\nvWLuA8kaHK5pe1RbyBYDdUNbrRs2I4LeUi8=\r\n=i0qZ\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","source":"src/index.js","gitHead":"f456b9e02f090cb3ab66eca61252ac6e0e335678","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v17.3.0+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"17.3.0","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.5"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.5_1648648939525_0.024963255221585712","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.6-alpha.0":{"name":"next-slicezone","version":"0.2.6-alpha.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.6-alpha.0","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"dd74f48032fa56d93dd1ae045c4e21c2b8b390f3","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.6-alpha.0.tgz","fileCount":30,"integrity":"sha512-Wm27En9/uYTEqJxkbYeqmwnYaeOSxH7S3GwShIqfBbLNLRLEWBRXkQDYxyjETkjILpUFQuFi2HCaGjQD94FAGQ==","signatures":[{"sig":"MEQCIDWbPQ3eAVYTE2cb29LbjWcE747BoxK1Grxj52NuElqdAiBUwgG8X63Ue37gJc/YPG/UcWrLQ0caIe6ottIhAVYisQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRtrfACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq5eQ/9G4KD9eh1Ok32wXcHke3AM2XyOMC8avNJt5ysneWgqc9lK48a\r\naIifQyJOtqFCOA9kH//gS+86am+c3pCJbIghSR9NT5lUDr3qjC1iBYM99Fci\r\ndC+Giju3n4Zx+FKLpqDXJRpmsXXZbuMKfEUuxlQ4BKnDT0XzVCoUEIfUbJtm\r\nR7IDNzeL2wiOHNvEYisSBPEodID3m5G4bW50OiOQfY8z/HIjgXh1dzDW0IkQ\r\n+oQ2mJT3W7pobbtcdh/a9L3fYMWiQsIEfGg2DMSgekztmbYPlGw26NQkQK/l\r\n8wNknxPLyJ96kMvaaPvT22pUBBtaC6TKlwcT0xZ3A4xFi1WECB4huag7dWW4\r\nBgrzl8qttJQytDjakSrGK7AdDxj1EVKb+TO8IgnE75d/oiF+rQdzeHPXzwQu\r\nNRsgHutmPfD4ma+8qIMtSvQz/psyCKgbgQe5yvBPEpS/QUwpcGp8i8RX+nbp\r\n6r49bUF0U585RoMjCeqHwquXhmvp5R0/SYVG+Ao3hv96jmlQrXJ7nbp5lmmQ\r\nUiZTlwKskLMl7Yrdb2SMboLr9eFq7iTR0Ci4nPs730tKncJAiKWHGPa9+8GR\r\nff2BQw+vtdU2xDDl3MoJwUfSIei+rtc6L7D66fUtHSahDhuKgodzYcLlVMyQ\r\nqVEcGYu3qei1z6MFrUINcCNzpkpg81FosVk=\r\n=nEXT\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"6868d8994a5705f20ae3fe2389eaad10f4108b33","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.0+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.0","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.6-alpha.0"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.6-alpha.0_1648810719451_0.06606906547473601","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.6-alpha.1":{"name":"next-slicezone","version":"0.2.6-alpha.1","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.6-alpha.1","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"0288813e3285aaea68e99fa5c93dce70f3731439","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.6-alpha.1.tgz","fileCount":30,"integrity":"sha512-txB925gxroUZ0pNiH9HRRt2wohHghi52zcex5fgf+QPyNQ8CQ59uClmmnuL9gLMYU78rrn8sS7asyFU2B7KhNA==","signatures":[{"sig":"MEQCIGCvqzoUrNESyt5gTWiFWWBPpQn21Zu0OnIngkyHneiCAiBrgOeybaWtsZUds5TzW2nUp02F35f7BpB8EnAKk6hZsA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiTEBMACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpYJw/9GO8EnIcV49QDIg9+OcAn/E2jQTYj0CqaVDDqvvlvEBb2fXdO\r\n1YbaAapwXIoFymTH8TO16Fw6B5e1Fx+SR6JmukY/3FVT6DeDsSnBO51PC7OJ\r\n18Nu6mYESvNSMkTpphvCUZgGfaHiBXqo9QDoV85AI8lT9zv7XXNZqRD0ALLX\r\nggN/vbEJFlVqU1E9e+07szCoFyLZdjfjrsRRYAtuBY8BE1V1wdLAdyNevZVe\r\n7HDiCz9dl08M5bMiJOBSgcrogNvfBZdMduMY+8I56WEVDHLE+P+cRozNk+GZ\r\nLSNv2meScL6k9xZcy8SLl0eLeUnPF1fkDS+RWOoXlct26CEZ13EYXlYuw/Vg\r\n1+JB9I2TBlzLhn8mTr4PPhu0Fdp+bMM/SyowjZq44lL5UvRo06fLLi2t4WNW\r\ntj3lQkDvkSXA9QGtlUu52soYJrH4CspVh7vfHCTQZSFJlLO5j2HDD7dhhHIZ\r\nDXPWi6OpADlydgfUBAN4jEphhBB5tE8XlElL1pgtRm0moHkyaNZO3tIglM8H\r\nv9LD1wPmOlrGWeIO83TxEE2RZ0zJOdQSxFfLBc37TJPELLmDo56y1AYspvR7\r\n14XD4Xx8CEMUV3QQd7mM9wPSm6XIDosngwexFVE/G8aea+WjeeIXofDcjUQm\r\nxtxVX3Tp3JIqlu6Z0owZAPVsAnKKZLuHTOU=\r\n=aDgt\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"de8667ad686ec34a087a39b29aae4f60d5651c44","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.2","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.6-alpha.1"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.6-alpha.1_1649164363795_0.6236869451989433","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.6-alpha.2":{"name":"next-slicezone","version":"0.2.6-alpha.2","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.6-alpha.2","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"7a1d4684510ef3abf4daf19de5c5589474e19c9c","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.6-alpha.2.tgz","fileCount":30,"integrity":"sha512-xLSu/2vZWqrR9sNt4bx+UgTvN27tdK7sIvLXRxBUKPJRx44Oueojjp7zdcXFDTU2Md9nmcaV2rgpET9tsFnoeg==","signatures":[{"sig":"MEYCIQCV27vUQE70vnfzN6/GjoPqnVndiPOIiMfMSo4yXP0zqQIhAOz2UNAf4ajM41j3Y06Uv+6LebA8IWQ68xj5b0S89g6E","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiTdIwACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr0iw//RMBa0n6WuKCXx1dxoKhfmeJ7MRxGI2hC/tgI4Blvd5todXBV\r\n0dBPDekUCecyseAxWmyp9QzvW5FeR5OOwhArh63b7TApg7DQ5nhO80IBKko2\r\nMLdaznk7KO7EpdkS023Q4nJMZL7mbzQrxlRWrTZeAn2tt6TdSsrCwO2DonVo\r\ndVRVuGb5nPTlORLE3YWlvUMLluKdvHjuRzbrS2obigwxNzjdp2hXMjT87g2L\r\n2NOHmU0dUJAg606fVNOi0jvFhkbvFdQ3khcbt8dHha568jv1x63V4/MBLHG9\r\n2KSqUPjUKjnefazIdd2LZ35hRPAKRbcysPriibjn5jl7KXktgQ4jOP6Dwq/I\r\ne5CLPNED2wHZKpq3tUA3lIS0jaAUI+6sVvMVmXhiVNw10QCjxSKUUmZwlfCi\r\npptJWsgOuKhtrwnaYU3X+Fxf/Zm993EgnMzmkqtIj0sfHeFZkeMYUuatudMW\r\nwwcqYqmxy44Gqliyt3QKh/aW6ObMyroLzKNuies4hQtadIikclMeMzAIzqW+\r\nqs8wIaXcDnbqHmsmFI8bzLF4y4oQjUizl2BNkVtG44BX0lAXCoBYxzHxoERT\r\nAH55T+orsA2X1tvZKxsvCiVphR8G2boItJOS7gxa42fMan6F1L6tt0/946FO\r\nIpkGyF07Sw4PS9SNR7Qk2s/o7cLCgJdKps0=\r\n=WS9R\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"1b392737172ad581d00ea84c23b453fb0d166a51","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.2","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.6-alpha.2"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.6-alpha.2_1649267248084_0.079427740671143","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.6-alpha.3":{"name":"next-slicezone","version":"0.2.6-alpha.3","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.6-alpha.3","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"c9a23af26db770938a04dcc3666c72821139b65c","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.6-alpha.3.tgz","fileCount":30,"integrity":"sha512-SDiXmytXXRPv9cNb9gT/wK8KnUVhq9Wrp49m51439iEbh2QF+BTOIU2fqri+THpZTwcJj4XvzvHkllHInilo2Q==","signatures":[{"sig":"MEUCIH9Bb+puh9SFRj3XqV4m32rcpyqBQIXAJzbrTUxLVjOdAiEAlJ07jgvNNBbAwrFioxfbeTFpRE/8mIF3cR60r7hKdRA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiTqTQACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrttxAApEBDTLnlr+9HapGaIXS51/+LlpuEQ/GLT531rSJBFLGPm1nH\r\n3OC/6osJVxfSCetABFARnj4fBew9xbScCFdWKSC817B4iXvC2t30sIsOji8d\r\n20mbEe/q8Bs2LQAzlxZHSOJSewhxReTZsSI71uCRuazXSoT+nXTzt6qv+2T0\r\nfVnkD+XOCWxN3Im30sz7BQ4pudQNn7rIYsgQdFPAgPNHdLWb5BLh1+azvNVq\r\n1MOfxEMCyzteqak44LN37JvQoooXRbDEaDzazG3rovGkwhbtl4YV6ZeJoK2X\r\nvq0t7pysCZcnUI5KEPLvudTeDBBR+ICFUffUq2QaBHGaURR30bttgreO47ln\r\nt8BhI4P9Evpr12FCZw1j0JZKJPNoUo3ci5gzGiYi8DQRDZQHeuoLD5yb3zVX\r\ng9F/g1OlFUuuepUCohD3fqfhQwCgJzO/O86Cu+EdnBKOG6UTaWt85nDLfBx1\r\nnp51NGX8Zoj85vARezWi3kjZ6dEGKH4KxSfOhlmm2VJfyqawToNUhLxh50Hh\r\nAWcwFqbe30AH3UONGNMBeID5CjCqrh2HkD7aV/pQ40FXsd8LVdpih2ks0iPH\r\nlEYe1SkAvPyZVwBKdv/lVVzXDtoAMGnmSQaKsYj8ffYGD6eUJMuuBcEjiRUb\r\nypbdAVj3zRH6cYAlA5EkQ4weQWVJFiHjX0w=\r\n=/0tM\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"a3204d4802df67b73fa0f242581b4c3a9cc14937","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.2","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.6-alpha.3"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.6-alpha.3_1649321168364_0.6467851504398798","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.6-alpha.4":{"name":"next-slicezone","version":"0.2.6-alpha.4","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.6-alpha.4","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"6c4af67071d1da4315de12988fc69f03e5798d05","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.6-alpha.4.tgz","fileCount":30,"integrity":"sha512-UTTrzfz1KwMP3p3syGGhXI7C4LI1YpDDmNlFCmP3sqXFEBFp5bnBk9zVRNIZkq9+3TZZVX5GkB5bBzlnBQIK/g==","signatures":[{"sig":"MEUCIGqHfW09J/+13sbxob40ipRvoVKmKgU5YGICqsfueDphAiEA52MblCHR3tiuIJ+thRLFmosFWnq+CidShepw6mOo9Nc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiT/kBACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqfqxAApOQzzgoB9r6/WyD4eTmI8KNUbl3M+aRLDGAFv2cWHi2rk4aW\r\nws4NDUScaI7N8CnFwaPqHa5d1AkE9uREseqVA03ZnQ++Z1i0008xBCpDIT+f\r\n22lLyxyYTMoixcyqjjYrk6u4EO+N5vPgtnK6vO2VBX0d6KQCVZvdJ0c7q5og\r\nMdwfJ6U7kaze1uB+zwYXlnRN9ssNaSqwIMyrxIB/gyuvujQOQEu9OCFPaC48\r\nnHSEvTH1q8+nb8Rw9IA7bEMOh3jZ7lghVB8k5RZGsoj5E9KhJjudrN817RLF\r\noMMYk/+DjJNzp8auUXNXpTdv9BN7yajnpI8yYiVA2TfMybZuBifOx7yhU2GN\r\nNFF52Ywd+O65DqnAuN6gKe6VnCIEJUQkggXBtve64fxkP19dLWiRi8BFyHR6\r\nIr/G8+XxazSwqfhwwKwlK69QBGVqsxzzL90Z0vvE0KGGmPpKueItnqHV57ou\r\nZd0MoPCGVUx5K2Z2n9ZWrHvK6QNBrUWp+ODUOHaVDRYZ817OqlX/HFYuGIAA\r\nm7JG95QOHhBUSQs6yRzHkzytfp1njrcZoCfIv/8npOy03DT6SkSf+Y37kCzW\r\nW5pH8kzw8ARMJOR4iILKt9KoqvM/ylAzh957d8Mw/7g6A/FwZDY2arJJPqsA\r\nvKQAvZuxoqr7UIa7n+xj2C0NKziimJk8YXA=\r\n=X2kN\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"0354b8b163e192c218479eedc158ecad06d366b0","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.2","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.6-alpha.4"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.6-alpha.4_1649408257302_0.7800820155223129","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.6-alpha.5":{"name":"next-slicezone","version":"0.2.6-alpha.5","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.6-alpha.5","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"cc14ec4b5ce27b3f8e313c60dda71f0063d165c6","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.6-alpha.5.tgz","fileCount":30,"integrity":"sha512-U7d5fGUPyIntQoYph1ezcgHnaeYfLsKjIHMeUiQskzpQA+tKcbI5YKW5ZXC1hDeLXGA9nDBoEOeNwZ+ttBn1Mg==","signatures":[{"sig":"MEQCIEzx3xqKDrPQblCO+LrtjgXiyQBJP0Zjp4/7T3AKphB1AiAyyzMZuWj+wdHWRlfqmU5x9w5mDc14DXMDrF6Zw+fBKg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiUABHACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpLPw//TDctcSXe6VKZ8bviGHDHsTcmcGLvM74GEDSt0p0AuyqrkcG1\r\nVhQHC0yyNHTT8dE/TJ9eA1GmxFJgSwCPUHvaXO2tayPnjhMoAmhEmroh9dMW\r\nxYAWUk7WftjIBfFGLXqDAjGTNvtKroxhYQ1n+kzT+PaDtnJAK8d+wl61XOs5\r\nK1+yhb1w/QFHn+qrBO8zSYx+/x0GMI4L7w6q0oWPuYzNx8c4rxfzMohEEQLz\r\nIGJ5HT3T18wa8vpgDdHxCqAAdkiqsWZ47ZlRzdhahPm4n6q5KoGNI/TFCiLZ\r\non5WkiPPDawvT86OyrmdOyYVATozRjRplxPXWeb2r8ucvorGolINyU34rmXb\r\nS7tbxDHCC24DrWNrVoFdnLkJXheD7/kvbtSE/V6+C2j1kXt0jdA9eZscoHid\r\ntn8JeKCuZ2kYSgHoMr5qh4CsX9EYPyMSCQZTAFwaDeByJmue1Ty3vyYatWTN\r\nmV8YARoGEKVVjOwfsrCdgveT+DoeLc1uIJwdS0PMhdzueWObHFTU/5YuKPgZ\r\n4g2yDQSbU6q6baXu7yMi/EInPMBnUB4rEhr78UMV4yKU2a18NhSMmYvSJRrp\r\nkPGeYeAPQmKa/HmsSCHlP4WWB4YE/+bEzJRaUa59k6k1dKW3u9dqaO7gfAo9\r\nz8xKOgIjVy2ek1Tb8imZ4Md25HCLycpo5us=\r\n=LzIQ\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"0de9890ad1d61f028f63b42fbc293276773c94e5","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.2","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.6-alpha.5"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.6-alpha.5_1649410119694_0.979851741502634","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.6":{"name":"next-slicezone","version":"0.2.6","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.6","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"903ee3b6d1aa56657a7f6cdce5886e5cf7138227","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.6.tgz","fileCount":30,"integrity":"sha512-FmLkyOXNTSw1aAsp9RE7wh+diaFjHI2TVehOeX46kQX6tVsQ7orQCUMgecz9+UUbz84xo1ke0wo+RoXkDWK67Q==","signatures":[{"sig":"MEYCIQC57xwDgdXPLeT7aAPxvavCYcbLAo9o2ujPUULEtDZsHQIhAI8Irw7StHBTNGjSFbBHZz7SRkpjj5ZrQxeWnV5KyHH4","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82830,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiUDjhACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqRIw//bail8ffEq1H27b64GN37/DSRWsAMR0/fYuZDeqGaJeT9Qpmw\r\nr26SujRVvRpiDLy/07Vc+DhOmzbm14Ahb5U2FID/h+FfAkDiqgbAECvdtW0h\r\nl61QGWofxIUr+l6IsjgUSZQKPhKR2tRbkKKhrgnVOHFu4GjgeDLTBId+lFp/\r\nQBVbJ1zDd184keT3X12hmQRqHfeQqJvk5ktwiYufRw33uy183YRjIYyzF8ID\r\nuHL7IFQdmBBRcmt9AvwsyQ/O9leywdAz0CN6yzFnOPhWfgyc5XGikfsj1Dvq\r\nALsvpwbw1Gx7eyzW758ZDuNlMbL3z/sUOEOuarVHVZaeroY1Z8rmJIFET3++\r\nxMHDWR2gGlDsCDZsdBukDJ+oWTrCzrKtVNMiffs+oHSaRSLpfalthoVheA2A\r\ni+/+hu00XTq0Z6gSf6CE6XepgfbuMxI000s1bZ7c3amO7uT2CU46vt+T8XrA\r\nzRSUkLXwaiFQBYnRHjRvuWnVQc6O3l8htnIBrwx1K0/wcj3MZ+All29DlV7I\r\nupPWTmBVvMhjmXjc1VqsSohI/QVqtuBFeIzfiN0AJu2PBgYvsouxG7hVgYNl\r\nhP6Tb68GOkJxKdDBg4lgoXLHCodgYMr+EjRJHv0iJwVZ28YAMc167yRuihhS\r\nwHO5rVfq6W/+ToQxInk080P4dVZ0czXGhaA=\r\n=QeOB\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","source":"src/index.js","gitHead":"ec6f9cd625377d9badfc3925c59edc66b58462bf","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.13.1+x64 (darwin)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.13.1","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.6"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.6_1649424609155_0.5480451953033321","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.7-alpha.0":{"name":"next-slicezone","version":"0.2.7-alpha.0","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.7-alpha.0","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"fe81f00d418da467e09a2635097ccc4a2607ead1","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.7-alpha.0.tgz","fileCount":30,"integrity":"sha512-mfwS0TdaBRtjQCqwLq9dZKAg/PXagROu5xfY9L6t366cmfuah/GMA3gFMpiS5uo8m28mLP9gfFZLQ/npMaRR+g==","signatures":[{"sig":"MEQCIB6ajGxYQp4hXCW8zqYr6t4TK8qh1GP2KBYNqU9qET6AAiBRD+MJDVzrhUNmzH1ZwTDDeBVLf7Nwumms91mFUMTWag==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiUEkaACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqJ0Q/+Pn2b52ZGorMDq0AowH4E6IkpL53VtkkUI7S9tOAXsGE+dNR9\r\n7SwELAFVhQTP2rRmf/tBYMVndJRFaCTO3TknOQH/Uz3KQVdrNUiMh1LcN5tO\r\n5IrW32ulb5ogE3HmUckOC2KGE/Hr2x8S42zg9TZ0eH58E591cajAm4KHfnbQ\r\nuTpKQVFGfQOvEY0YerOY6QTFrW8QVTdyFcmMB9B1u3VDXjA1MbbkJ3cPVHsK\r\nXDhKDSZ3M+IZveRNG08CSGlnTQROIcSe5hww04bS3UF8/IsAAVsxQ6iuzvJ1\r\nvk9hPbevPbDl9uQJPif0l4roaNDV/NocOT1FWB3uGB6TzEyW6ciHDyC0UMnJ\r\nozPyJo6hDyMBEEAMkrwusw9PISaZHV/9p2bPYDGuv9N7PJmguvJeJQcRNHZE\r\nKtktuOWp7+5h+vP88zYEj0gpK66y++yWiI/z26Oa81lhGX7ThWSE2Hbnmuj2\r\nPcX00Bi7idDOpgmNBoUAuaqhdHMJgRhgfrxFNQlFM65kh1h8Z8h1kDGvu7bB\r\nH943Uqs72f9hYoqMDdZGoT7UNUlOWCsfBpumWgXGsFzlc6rWRcORF61TK6lf\r\nC1KlhptL4WUZRiTxc42EaN6UeaKk0Y3CJGA7wH4ZrFmbdHXGazptVFfT2dHc\r\ngqWNWyRtbHNJ0CF35YLnDpOMKrUBjGc05RU=\r\n=8ktF\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"3346ffcfcfd9353d7f6465648fe6a5d52bcdaa3d","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.2","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.7-alpha.0"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.7-alpha.0_1649428762037_0.5614071653437942","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.7-alpha.1":{"name":"next-slicezone","version":"0.2.7-alpha.1","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.7-alpha.1","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"f8f5c2caadc1457f024d8590a0ea5dbd43aaabe2","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.7-alpha.1.tgz","fileCount":30,"integrity":"sha512-hmLOGbV5y4Fr7j0km2CshVJAV/yrIpNgOjZ6fXqw6IGZ9eJwDgYWYq+JTqxk6jFgIZI7zkyqeSwRClblxKM1+g==","signatures":[{"sig":"MEQCIBljYZBD9yjz4z7nEJj0MDN4GFPOnMWIUaaRhr4JfPEFAiAGtVEYHNdrw0BcErFtlFj30tOTlYNWsPBi93fo1Z7rRA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiVEV9ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrNXhAAmaxaxiRgzWRGtze23Ca11LaoImztuBNqLWmztWRJwcQJyuYn\r\nWTHc90t/TmkqLMxRMHP98Mfmk4vIByhM++xs0YaIP539zpvKJ+reNDr3NPtp\r\nylsFGUqV8+F1jOlP5uoAbexY2xJnvHT42vR3TXOl2rYt2mT6ud6WEjbjvl+6\r\nq1Jae2nsjsv5q8NN70U5zTXUmHI18Tr0u/e3BOP7zm6uA96nf+9zRpZEBxNi\r\nLQ7hYcP0/2oaaLDSO7hP3h9eXDWkd4e/whVgXWVABtua2asTegGwpNPc80N7\r\nR7+23UpDRii8JUUKQyQs+DHDS+7E8Scu1uAF738MUVQWbBTxuhP5WJyfY1tz\r\nT4N+hgzx4EV6KaSLFQ2Tisi5gipxCkl1J4+pEydcHKVTbWgidfTgjr6c1ot9\r\n/K0huOk/46G97yQusYgICQGMoo+zSxH+AFW6EUM/KvN4TjkEZ3i8lYXUVuvD\r\nUiLZhaexrDq0TR2A3KvJsF1v7JyDrOiaUfCNh9qxptmYA4SHplsOPR7Sl60x\r\nSO8BefcFV6VxQJKOKB+tq0/kOuDebYpNr3pBETf4non2Br1WpTvK+WhCiNOH\r\nTTlxQTIE+RFtOm862qzB1xuONyBaqwSusC10zD0VA2lt7g0eqVwyRzNUrX8C\r\nQioVJq/+KpgVZskkuI9hoU/DpjdChT+d9yk=\r\n=IymK\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"9833a6eb6f7503ca088aaa973c8685021c15ef9b","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.2","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.7-alpha.1"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.7-alpha.1_1649689980985_0.1489812727169404","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"},"0.2.7-alpha.2":{"name":"next-slicezone","version":"0.2.7-alpha.2","keywords":["Reactjs","Prismic","slices"],"author":{"name":"Hugo Villain"},"license":"ISC","_id":"next-slicezone@0.2.7-alpha.2","maintainers":[{"name":"sprite","email":"marcmcintosh1987@gmail.com"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"lihbr","email":"hello@lihbr.com"}],"homepage":"https://github.com/prismicio/sm-commons#readme","bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"dist":{"shasum":"daaecfeca105ffcef44ada18a902e344e261652b","tarball":"https://registry.npmjs.org/next-slicezone/-/next-slicezone-0.2.7-alpha.2.tgz","fileCount":30,"integrity":"sha512-0i45OkCnlDwvlVv17TGlEc9wKJNA96QrtfmKbliVlusjWkFry9RI7PbraBecVb1FT0hIjTDrxBXehyQqUe5o2Q==","signatures":[{"sig":"MEQCIG6yl9AiHWZTZkPmIKJlSVrvpEwXWpZ6/u5T+NjA2r6gAiBBFkQXzgpp/nyKPJSslPyXigo1fEYfVi0p0kDQh2h1Vg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":82846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiVW4xACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrYrQ/9FqpOyODC8RGMCsqtjXS1OTD7Jm+EEq8cEwdfRDSaGGqHABUJ\r\ncwWdxCgNy/mHpZkPeNZF2aWRCC83hI7PpRFDObThIpvQLCD4s6YGtwKhArVr\r\ncLFLvIfxgMxxRU2CBZild8ixE3yzUNQVMtMCBc5qSe+/x4z8zxrJCorli6Dg\r\nL0kb3c8xf1JOzgNRWm0G31orHox5TMMKASVAW2I6JEmJLkB0W2W3IocAiyZa\r\n9t4xZzjKHUESgt8/+IF7CiyJMZaezNmB2dU6uKDj/aGfFmd+bb8NXidxZ88p\r\nrrxRxS0HomMIhdZ/vxoK5+9NJqgTBokPI9HJ40ymFIwh1o1FX4JvQrbETet1\r\niSLhinvuMBfvz0mNRM5GoLw2QUOKuWJT4jdP2n4I7lviyEQhj1uRTcHX77tC\r\neJP7PxhqTdgg1LIp2DYvyr8OZJ1pHZBmPRvVJAUXJ8umb+le7iz8FbvnblHX\r\nhT2LXIpw65IZYCg54FYb8ETYvEM6YzlPYUU2mgdpr8g3MjgaoHLpcZWRwwGz\r\nXszRMFncvZYz0qhJtFlTLZPtiLReFCFNEOZAYrffq9ArbIH4rmJQXHWQ04Zg\r\nQRPq2as3tI16imBWUr0w6vP5z0p17eymjKzc6ii1jlklFbNM/aweWqLZfp1N\r\nx2yekRJVr2lTOb76Kr7YnSxRXc46tSdmlAk=\r\n=cykL\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","unpkg":"dist/index.umd.js","module":"dist/index.module.js","readme":"# Next SliceZone\n\nA component that fetches Prismic files, returns slices found and matches them with front-end components.\n\nRFC: https://github.com/prismicio/slice-machine/issues/7\n\n## Fetching content\n\nNext SliceZone exports 2 functions that are designed to help you quickly get all static paths of a NextJS given route, fetch associated documents on Prismic, and return slices found there.\n\n### useGetStaticProps\n\n`useGetStaticProps` can be used in every page using the SliceZone.\nIt's responsible for:\n\n- fetching content from Prismic\n- returning a pre-written Next `getStaticProps`\n\n#### Page example\n\nQuery a singleton page of type \"homepage\"\n\n```javascript\nimport { Client } from \"../prismic\";\nimport { useGetStaticProps } from \"next-slicezone/hooks\";\nimport resolver from \"../sm-resolver\";\n\nconst Page = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticProps` takes a params object as argument.\n\n| Param                | Type     | Required | Default value | Description                                                                     | Example value               |\n| -------------------- | -------- | -------- | ------------- | ------------------------------------------------------------------------------- | --------------------------- |\n| apiParams            | object   | false    | null          | Object passed to client `apiOptions`.                                           | { lang: 'fr-fr' }           |\n| client               | function | true     | null          | Pass a Prismic client here                                                      | Prismic.client(apiEndpoint) |\n| slicesKey            | string   | false    | body / slices | Key of slices array in API response (`doc.data[slicesKey]`)                     | 'MySliceZone'               |\n| type                 | string   | false    | page          | Custom type to be queried                                                       | 'another_cts'               |\n| queryType            | string   | false    | repeat        | One of 'repeat' or 'single', to switch between `getByUID` and `getSingle` calls | 'single'                    |\n| getStaticPropsParams | object   | false    | null          | Object passed to return object of `getStatcProps`                               | { revalidate: true }        |\n\n#### Example with API Params\n\nYour API calls might depend on other factors in your app, for example the language the user talks. Pass an `apiParams` object or function to transform your call to the Prismic API.\n\n```javascript\nconst PageInFrench = ({ uid, slices }) => (\n  <SliceZone resolver={resolver} slices={slices} />\n);\n\nexport const getStaticProps = useGetStaticProps({\n  client: Client(),\n  type: \"homepage\", // query document of type \"page\"\n  queryType: \"single\", // homepage is a singleton document\n  apiParams: {\n    lang: \"fr-fr\",\n  },\n});\n\nexport default PageInFrench;\n```\n\n👆 `apiParams` can also be a function! See example below\n\n### useGetStaticPaths\n\n`useGetStaticPaths` should be used _in each dynamic page_ that relies on the SliceZone.\nIt's responsible for:\n\n- fetching documents by type on Prismic\n- formatting params passed to getStaticProps\n\n#### Page example (`/pages/[lang]/[uid]`)\n\nQuery a repeatable type \"page\" in a language based on URL parameter.\n\n```javascript\nimport { useGetStaticProps, useGetStaticPaths } from \"next-slicezone/hooks\";\n\nconst Page = ({ uid, slices, data }) => (\n  <div>\n    <h1>{data.keyTextTitle}</h1>\n    <SliceZone resolver={resolver} slices={slices} />\n  </div>\n);\n\nexport const getStaticProps = useGetStaticProps({\n  type: \"page\",\n  queryType: \"repeat\",\n  apiParams({ params }) {\n    // params are passed by getStaticPaths\n    return {\n      lang: params.lang,\n      uid: params.uid,\n    };\n  },\n});\n\n// fetch all docs of type `MyPage` and pass params accordingly\nexport const getStaticPaths = useGetStaticPaths({\n  client: Client(),\n  type: \"page\",\n  formatPath: (prismicDocument) => {\n    return {\n      params: {\n        uid: prismicDocument.uid,\n        lang: prismicDocument.lang,\n      },\n    };\n  },\n});\n\nexport default Page;\n```\n\n#### Properties\n\n`useGetStaticPaths` takes a params object as argument.\nRefer to [Next docs](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation) to understand what's expected from `formatPath`.\n\n| Param      | Type     | Required | Default Value | Description                                               | Example                       |\n| ---------- | -------- | -------- | ------------- | --------------------------------------------------------- | ----------------------------- |\n| type       | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| apiParams  | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| client     | -        | -        | -             | Same as useGetStaticProps                                 | -                             |\n| formatPath | function | true     | (doc) => null | Function to format Next path argument. Pass null to skip. | ({uid}) =>({ params:{ uid }}) |\n\n### SliceZone\n\nOnce slices have been fetched server-side, we need to get all slices found and match them with your components.\n\nTo display the right content, the SliceZone takes as parameters\nprops passed at build time by `useGetStaticProps`. Notably:\n\n- `slices`, the array data components fetched from Prismic\n- `resolver`, a function that resolves calls to components from the SliceZone\n- `sliceProps`, an object or function that passes props to matched slices\n\n#### Example SliceZone\n\n```\nconst Page = ({ data, slices }) => (\n    <SliceZone\n        slices={slices}\n        resolver={resolver}\n        sliceProps={({ slice, sliceName, i }) => ({\n           theme: i % 1 ? 'light' : 'dark',\n           alignLeft: data.keyTextTitle?.length > 35\n        })}\n)\n\n```\n\nThe resolver function can be generated for you and should be everytime you make a change to your slices structure (rename, add, delete a slice, add a library...). To do this, create a `pages/_document` file and add the `createResolver` method to its `getInitialProps` method:\n\n#### Example \\_document file\n\n```javascript\nimport Document, { Html, Head, Main, NextScript } from \"next/document\";\nimport { createResolver } from \"next-slicezone/resolver\";\n\nexport default class extends Document {\n  static async getInitialProps(ctx) {\n    const initialProps = await Document.getInitialProps(ctx);\n    /* In development, generate an sm-resolver.js file\n    that will map slices to components */\n    if (process.env.NODE_ENV === \"development\") {\n      await createResolver();\n    }\n    return { ...initialProps };\n  }\n\n  render() {\n    return (\n      <Html>\n        <Head />\n        <body>\n          <Main />\n          <NextScript />\n        </body>\n      </Html>\n    );\n  }\n}\n```\n","source":"src/index.js","gitHead":"ca31c1ba11316b96cb3ef44dbe80345a52b53951","scripts":{"lint":"eslint --ext .js,.jsx .","test":"jest","audit":"better-npm-audit audit -l high -p","build":"rollup -c","audit-fix":"npm audit fix","prepublishOnly":"yarn build && yarn test"},"_npmUser":{"name":"sprite","email":"marcmcintosh1987@gmail.com"},"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v16.14.2+x64 (linux)","description":"A component that maps other components to Prismic slices","directories":{},"resolutions":{"sm-commons/**/trim-newlines":">=3.0.1 <4.0.0 || >=4.0.1"},"_nodeVersion":"16.14.2","dependencies":{"slash":"^3.0.0","sm-commons":"0.1.7-alpha.2"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^27.0.4","memfs":"^3.2.2","react":">=16.14.0","eslint":"^7.32.0","rollup":"^2.55.1","unionfs":"^4.4.0","react-dom":">=16.14.0","better-npm-audit":"^3.4.0","@babel/preset-env":"^7.14.9","eslint-plugin-jest":"^24.4.0","@babel/preset-react":"^7.14.5","eslint-plugin-react":"^7.25.1","@rollup/plugin-babel":"^5.3.0","rollup-plugin-terser":"^7.0.2","@testing-library/react":"^12.0.0","@rollup/plugin-commonjs":"^20.0.0","@testing-library/jest-dom":"^5.14.1","@rollup/plugin-node-resolve":"^13.0.4","@babel/plugin-transform-runtime":"^7.14.5","rollup-plugin-peer-deps-external":"^2.2.4","@babel/plugin-transform-modules-commonjs":"^7.14.5"},"peerDependencies":{"react":">=16.14.0","react-dom":">=16.14.0"},"_npmOperationalInternal":{"tmp":"tmp/next-slicezone_0.2.7-alpha.2_1649765936992_0.03487572823520191","host":"s3://npm-registry-packages"},"deprecated":"next-slicezone is now part of @prismicio/react"}},"time":{"created":"2020-06-15T10:25:20.312Z","modified":"2026-08-03T02:50:44.403Z","0.0.1":"2020-06-15T10:25:20.404Z","0.0.2":"2020-06-19T14:47:09.919Z","0.0.3":"2020-06-22T12:34:54.003Z","0.0.4":"2020-06-22T14:19:10.132Z","0.0.5":"2020-06-22T14:58:07.639Z","0.0.6":"2020-06-22T15:55:54.528Z","0.0.7":"2020-06-22T16:22:49.251Z","0.0.8":"2020-06-25T12:53:55.198Z","0.0.9":"2020-09-14T15:02:42.365Z","0.0.10":"2020-10-27T16:21:45.688Z","0.0.11":"2020-12-01T14:27:51.245Z","0.0.12-alpha.0":"2021-01-20T15:01:37.510Z","0.0.12":"2021-01-21T14:06:56.550Z","0.0.13":"2021-02-17T15:38:31.265Z","0.0.14":"2021-03-01T15:35:01.049Z","0.0.15-alpha.0":"2021-03-01T16:16:53.086Z","0.0.15":"2021-04-15T13:18:52.407Z","0.1.0-alpha.0":"2021-05-07T14:57:32.352Z","0.1.0":"2021-06-22T15:24:54.876Z","0.1.1":"2021-08-04T14:26:43.294Z","0.1.2":"2021-08-05T06:56:21.125Z","0.1.3-beta.1":"2021-11-23T15:05:17.901Z","0.1.3-beta.2":"2021-11-23T15:47:22.252Z","0.1.3-beta.3":"2021-11-24T13:07:16.572Z","0.1.3":"2021-11-24T15:55:34.892Z","0.1.4-alpha.1":"2021-11-26T16:53:24.411Z","0.1.4-alpha.2":"2021-11-29T14:47:42.954Z","0.1.4-alpha.3":"2021-12-02T13:08:02.590Z","0.1.4-alpha.4":"2021-12-02T16:43:04.675Z","0.1.4-alpha.5":"2021-12-06T15:04:50.427Z","0.1.4-alpha.8":"2021-12-13T10:58:59.185Z","0.1.4-alpha.9":"2021-12-13T13:57:50.699Z","0.1.4-alpha.10":"2021-12-13T15:03:43.924Z","0.1.4-alpha.11":"2021-12-13T15:42:38.426Z","0.1.4-alpha.12":"2021-12-14T09:14:02.108Z","0.1.4-alpha.13":"2021-12-14T15:42:34.825Z","0.1.4-alpha.14":"2021-12-15T10:18:26.666Z","0.1.4-alpha.15":"2021-12-16T13:45:05.718Z","0.1.4-alpha.16":"2021-12-16T13:51:06.414Z","0.1.4-alpha.17":"2021-12-17T08:57:55.213Z","0.1.4-alpha.18":"2021-12-20T15:36:55.663Z","0.1.4-alpha.19":"2021-12-21T12:21:43.188Z","0.1.4-alpha.20":"2021-12-22T10:45:24.429Z","0.1.4-alpha.21":"2021-12-22T13:02:05.613Z","0.1.4-alpha.22":"2021-12-23T16:43:35.512Z","0.1.4-alpha.23":"2022-01-03T15:24:03.722Z","0.1.4-alpha.24":"2022-01-04T16:52:00.062Z","0.1.4-alpha.25":"2022-01-10T14:51:32.011Z","0.1.4-alpha.26":"2022-01-10T16:26:53.657Z","0.1.4-alpha.28":"2022-01-11T13:35:35.123Z","0.1.4-alpha.29":"2022-01-11T14:45:50.766Z","0.1.4-alpha.30":"2022-01-11T15:11:31.496Z","0.1.4-alpha.31":"2022-01-12T11:21:50.080Z","0.1.4-alpha.32":"2022-01-12T15:09:38.864Z","0.1.4-alpha.33":"2022-01-12T15:28:53.891Z","0.1.4-alpha.34":"2022-01-13T11:11:02.444Z","0.1.4-alpha.35":"2022-01-14T17:41:23.960Z","0.1.4-alpha.36":"2022-01-18T08:48:07.209Z","0.1.4-alpha.37":"2022-01-18T11:05:58.719Z","0.1.4-alpha.38":"2022-01-18T13:32:16.880Z","0.1.4-alpha.39":"2022-01-19T11:04:04.405Z","0.1.4-alpha.40":"2022-01-19T13:23:06.206Z","0.1.4-alpha.42":"2022-01-19T17:29:45.689Z","0.1.4-alpha.43":"2022-01-20T09:38:54.081Z","0.1.4-alpha.44":"2022-01-20T10:26:21.429Z","0.1.4-alpha.45":"2022-01-20T11:12:33.002Z","0.1.4-alpha.46":"2022-01-20T13:55:08.876Z","0.1.4-alpha.47":"2022-01-20T14:51:53.900Z","0.1.4-alpha.48":"2022-01-24T09:12:20.966Z","0.1.4-alpha.49":"2022-01-24T11:48:13.433Z","0.1.4-alpha.50":"2022-01-24T14:51:38.754Z","0.1.4-alpha.51":"2022-01-24T15:36:20.621Z","0.2.0":"2022-01-25T14:18:50.089Z","0.2.1-alpha.0":"2022-01-27T12:38:33.687Z","0.2.1-alpha.1":"2022-01-27T17:21:43.853Z","0.2.1-alpha.2":"2022-01-27T18:23:27.335Z","0.2.1-alpha.3":"2022-01-28T09:58:08.567Z","0.2.1-alpha.4":"2022-01-28T20:44:54.550Z","0.2.1-alpha.5":"2022-01-31T11:41:32.342Z","0.2.1-alpha.6":"2022-01-31T18:46:52.850Z","0.2.1-alpha.7":"2022-02-01T09:56:03.245Z","0.2.1-alpha.8":"2022-02-01T12:04:15.160Z","0.2.1-alpha.9":"2022-02-01T13:41:33.780Z","0.2.1-alpha.10":"2022-02-02T09:58:15.021Z","0.2.1-alpha.11":"2022-02-03T16:12:06.825Z","0.2.1-alpha.12":"2022-02-07T13:26:21.840Z","0.2.1-alpha.13":"2022-02-07T16:02:55.438Z","0.2.1-alpha.14":"2022-02-08T14:51:55.817Z","0.2.1-alpha.15":"2022-02-08T15:05:33.648Z","0.2.1-alpha.16":"2022-02-09T15:05:05.485Z","0.2.1-alpha.17":"2022-02-10T09:51:29.516Z","0.2.1-alpha.18":"2022-02-14T14:03:47.251Z","0.2.1-alpha.19":"2022-02-15T10:46:39.624Z","0.2.1-alpha.20":"2022-02-16T10:43:12.392Z","0.2.1-alpha.21":"2022-02-16T15:10:25.678Z","0.2.1-alpha.22":"2022-02-17T13:28:48.902Z","0.2.1-alpha.23":"2022-02-17T17:14:35.641Z","0.2.1-alpha.24":"2022-02-18T10:53:55.951Z","0.2.2-alpha.0":"2022-02-18T14:09:47.441Z","0.2.1":"2022-02-21T10:55:06.110Z","0.2.2-alpha.1":"2022-02-21T11:54:19.459Z","0.2.2-alpha.2":"2022-02-21T17:36:17.733Z","0.2.2-alpha.3":"2022-02-22T11:11:09.800Z","0.2.2-alpha.4":"2022-02-22T12:32:43.614Z","0.2.2-alpha.5":"2022-02-22T13:06:31.053Z","0.2.2-alpha.6":"2022-02-22T14:39:34.178Z","0.2.2-alpha.7":"2022-02-22T15:40:40.385Z","0.2.2-alpha.8":"2022-02-22T15:59:59.550Z","0.2.2-alpha.9":"2022-02-22T17:10:37.328Z","0.2.2-alpha.10":"2022-02-23T10:29:13.060Z","0.2.2-alpha.11":"2022-02-23T18:06:46.332Z","0.2.2-alpha.12":"2022-02-24T09:51:35.396Z","0.2.2-alpha.13":"2022-02-24T10:22:17.754Z","0.2.2-alpha.14":"2022-02-24T13:36:17.759Z","0.2.2-alpha.15":"2022-02-25T15:36:22.563Z","0.2.2-alpha.16":"2022-02-25T16:49:24.611Z","0.2.2-alpha.17":"2022-02-28T16:01:06.457Z","0.2.2-alpha.18":"2022-02-28T16:57:52.727Z","0.2.2-alpha.19":"2022-03-01T14:16:23.860Z","0.2.3-alpha.0":"2022-03-01T14:26:41.840Z","0.2.3-alpha.1":"2022-03-02T16:45:07.857Z","0.2.3-alpha.2":"2022-03-03T16:35:04.589Z","0.2.2-alpha.20":"2022-03-03T16:49:57.321Z","0.2.3-alpha.3":"2022-03-04T15:15:01.844Z","0.2.3-alpha.4":"2022-03-04T16:35:29.934Z","0.2.3-alpha.5":"2022-03-07T15:46:11.311Z","0.2.2-alpha.21":"2022-03-08T10:36:19.105Z","0.2.2":"2022-03-08T13:00:43.260Z","0.2.3-alpha.6":"2022-03-08T15:35:24.270Z","0.2.3-alpha.7":"2022-03-09T14:24:42.869Z","0.2.3-alpha.8":"2022-03-09T14:57:22.879Z","0.2.3-alpha.9":"2022-03-11T15:20:14.126Z","0.2.3-alpha.10":"2022-03-11T16:03:23.034Z","0.2.3-alpha.11":"2022-03-11T17:11:09.279Z","0.2.3-alpha.12":"2022-03-15T10:28:58.961Z","0.2.3-alpha.13":"2022-03-15T15:21:15.958Z","0.2.3":"2022-03-16T13:07:11.408Z","0.2.4-alpha.0":"2022-03-16T13:35:18.076Z","0.2.4":"2022-03-16T14:05:48.758Z","0.2.5-alpha.0":"2022-03-16T14:47:00.057Z","0.2.5-alpha.1":"2022-03-17T17:48:02.983Z","0.2.5-alpha.2":"2022-03-18T16:16:34.669Z","0.2.5-alpha.3":"2022-03-23T10:57:20.935Z","0.2.5-alpha.4":"2022-03-23T11:16:14.740Z","0.2.5-alpha.5":"2022-03-25T10:42:57.298Z","0.2.5-alpha.6":"2022-03-25T13:38:54.975Z","0.2.5-alpha.7":"2022-03-25T16:19:08.164Z","0.2.5-alpha.9":"2022-03-29T14:26:02.049Z","0.2.5-alpha.10":"2022-03-29T15:24:34.164Z","0.2.5-alpha.11":"2022-03-30T09:26:08.866Z","0.2.5-alpha.12":"2022-03-30T09:56:38.560Z","0.2.5":"2022-03-30T14:02:19.734Z","0.2.6-alpha.0":"2022-04-01T10:58:39.666Z","0.2.6-alpha.1":"2022-04-05T13:12:44.038Z","0.2.6-alpha.2":"2022-04-06T17:47:28.249Z","0.2.6-alpha.3":"2022-04-07T08:46:08.556Z","0.2.6-alpha.4":"2022-04-08T08:57:37.493Z","0.2.6-alpha.5":"2022-04-08T09:28:39.882Z","0.2.6":"2022-04-08T13:30:09.339Z","0.2.7-alpha.0":"2022-04-08T14:39:22.248Z","0.2.7-alpha.1":"2022-04-11T15:13:01.158Z","0.2.7-alpha.2":"2022-04-12T12:18:57.295Z"},"bugs":{"url":"https://github.com/prismicio/sm-commons/issues"},"author":{"name":"Hugo Villain"},"license":"ISC","homepage":"https://github.com/prismicio/sm-commons#readme","keywords":["Reactjs","Prismic","slices"],"repository":{"url":"git+https://github.com/prismicio/sm-commons.git","type":"git"},"description":"A component that maps other components to Prismic slices","maintainers":[{"name":"amaurycahuet","email":"amaury.cahuet@prismic.io"},{"name":"hypervillain","email":"hugo.p.villain@gmail.com"},{"name":"lihbr","email":"hello@lihbr.com"},{"name":"sprite","email":"marcmcintosh1987@gmail.com"}],"readme":"","readmeFilename":""}