{"_id":"@artsy/stitch","_rev":"84-e4232a27668a2906a7fa64e0968090a0","name":"@artsy/stitch","dist-tags":{"canary":"6.1.7-canary.103.1452.0","latest":"6.5.0"},"versions":{"1.0.0":{"name":"@artsy/stitch","version":"1.0.0","license":"MIT","_id":"@artsy/stitch@1.0.0","maintainers":[{"name":"damassi","email":"damassi.pappas@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"f430faa9486432f5fcc7358f67e652a264ff3f30","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.0.0.tgz","integrity":"sha512-hgXeZBb1w7D3wLhujms273wZayP4RtB429pSrdzTZzRPAuveolqzF/GVNenGck19y9k7RJ1Y+ek8PvyNE/p+Ng==","signatures":[{"sig":"MEUCIQC5w9ORnIJAGJjWUyiGgtkE+3YbG96bOtmJPRz2BtnsxQIgbjgY0eXVby+v7SVwTCp3SOmePf+nuriI7NjOu7w2sq0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"index.js","_from":".","_shasum":"f430faa9486432f5fcc7358f67e652a264ff3f30","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"861fe171c3490352eea3a7fcc847df50acaff54b","scripts":{"test":"jest","coverage":"jest --coverage","test:watch":"jest --watch"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"3.10.10","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"6.11.1","dependencies":{"react":"^15.6.1","lodash":"^4.17.4","babel-cli":"^6.26.0","react-dom":"^15.6.1","consolidate":"^0.14.5","babel-runtime":"^6.26.0","babel-preset-react":"^6.24.1","babel-preset-es2015":"^6.24.1","babel-preset-stage-3":"^6.24.1"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","eslint-plugin-node":"^5.1.1","eslint-plugin-react":"^7.3.0","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.0.0.tgz_1503707300523_0.959678647108376","host":"s3://npm-registry-packages"}},"1.0.1":{"name":"@artsy/stitch","version":"1.0.1","license":"MIT","_id":"@artsy/stitch@1.0.1","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"npm@yukinishijima.net"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"c9f2018822975e94c9183d9d6c38b5591add9319","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.0.1.tgz","integrity":"sha512-3OCmw51O5GJJjp0NV3JZf6X/78DAsQBImY9lWDIGimV6T4nap7OKUjWq+GzC9rbNSubP7pXfOuTlK7npcNW+xg==","signatures":[{"sig":"MEUCIQCG7DlQwvVHm+QRMesy0IqAfeXN/mEb4QvvhNLTEueDFwIgU4qHD3dK3mNW56n8P15ZG0rx0CRoNV+tI8hSlcbePUg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"index.js","_from":".","_shasum":"c9f2018822975e94c9183d9d6c38b5591add9319","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"d7fa8811cc095f9730cae2e9a928ce8c0f68e85d","scripts":{"test":"jest","coverage":"jest --coverage","test:watch":"jest --watch"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"3.10.10","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"6.11.1","dependencies":{"react":"^15.6.1","lodash":"^4.17.4","babel-cli":"^6.26.0","react-dom":"^15.6.1","consolidate":"^0.14.5","babel-runtime":"^6.26.0","babel-preset-react":"^6.24.1","babel-preset-es2015":"^6.24.1","babel-preset-stage-3":"^6.24.1"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","eslint-plugin-node":"^5.1.1","eslint-plugin-react":"^7.3.0","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.0.1.tgz_1503707636726_0.12280030851252377","host":"s3://npm-registry-packages"}},"1.0.2":{"name":"@artsy/stitch","version":"1.0.2","license":"MIT","_id":"@artsy/stitch@1.0.2","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"npm@yukinishijima.net"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"f4f4f519c07bda7a9418e7210be3603ef0ed271b","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.0.2.tgz","integrity":"sha512-0saC0j4QaPhsW4fK8X+kr7+OrIScFmN0XH64jk62BkIb13eM7j7WD7Xz7l9yCb06ybbNQ0ygIDPfhlkZ8qnm/Q==","signatures":[{"sig":"MEUCIQCijHB7IYqnE4LqbGjwY8bS1ARHoNI+jmmtDzBTxMnveQIgeWr87eMw+i7OpJWs/861R+etZoG/12HKaU9G4YIL8r0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"index.js","_from":".","_shasum":"f4f4f519c07bda7a9418e7210be3603ef0ed271b","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"82725586619adb3b81037ab1245916de8e02d22d","scripts":{"test":"jest","coverage":"jest --coverage","test:watch":"jest --watch"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"3.10.10","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"6.11.1","dependencies":{"react":"^15.6.1","lodash":"^4.17.4","babel-cli":"^6.26.0","react-dom":"^15.6.1","consolidate":"^0.14.5","babel-runtime":"^6.26.0","babel-preset-react":"^6.24.1","babel-preset-es2015":"^6.24.1","babel-preset-stage-3":"^6.24.1"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","eslint-plugin-node":"^5.1.1","eslint-plugin-react":"^7.3.0","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.0.2.tgz_1503708234541_0.6706238470505923","host":"s3://npm-registry-packages"}},"1.0.3":{"name":"@artsy/stitch","version":"1.0.3","license":"MIT","_id":"@artsy/stitch@1.0.3","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"npm@yukinishijima.net"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"b246f61d8c011875a9e5158db1472e91a48a2413","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.0.3.tgz","integrity":"sha512-xpYeYxsBpIBRlGcX3uLeGhlaq42crWpczrWXookvVYeEpez6eEMzUMh9mZGgChncVKnkxdZTUGH03vHilAeNtw==","signatures":[{"sig":"MEYCIQDbq1ohdHzlS44wgEb2AqWjRCMxYqE1xcr8WoebqBUgQgIhANHbsHLL0AXIY4VhWz47Te5wCC0IYY+PQVxjxM7ItGDT","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"index.js","_from":".","_shasum":"b246f61d8c011875a9e5158db1472e91a48a2413","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"13d05aaabc46d10c2b6b76e2de4cee09e87ed0fc","scripts":{"test":"jest","coverage":"jest --coverage","test:watch":"jest --watch"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"3.10.10","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"6.11.1","dependencies":{"react":"^15.6.1","lodash":"^4.17.4","babel-cli":"^6.26.0","react-dom":"^15.6.1","consolidate":"^0.14.5","babel-runtime":"^6.26.0","babel-preset-react":"^6.24.1","babel-preset-es2015":"^6.24.1","babel-preset-stage-3":"^6.24.1"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","eslint-plugin-node":"^5.1.1","eslint-plugin-react":"^7.3.0","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.0.3.tgz_1503710390036_0.5560009598266333","host":"s3://npm-registry-packages"}},"1.0.4":{"name":"@artsy/stitch","version":"1.0.4","license":"MIT","_id":"@artsy/stitch@1.0.4","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"npm@yukinishijima.net"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"ffb7043894961d7330d5071138b93221ad8455f3","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.0.4.tgz","integrity":"sha512-xV0rJ7hkla/xyLSCxvCTfiET5ke3mfZKKWEy9cmt1LSocnr5zCLRi3dS100VZmnpVx51QMWss3Ltc2Ky5E+70w==","signatures":[{"sig":"MEUCIEQ/cD0C6XqWC/vD3WpZoTArqXFUMF2TUH3NsK3RTs/eAiEAzQ8DUY3efAJID1JZ5jz7DbzOTGKyP5ifMW948/cCBVQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"./dist/index.js","_from":".","_shasum":"ffb7043894961d7330d5071138b93221ad8455f3","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"20d982f069790f8a2a783ebc72714ccb474dda6c","scripts":{"test":"jest","build":"babel lib --ignore lib/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn clean:build && yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"3.10.10","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"6.11.1","dependencies":{"react":"^15.6.1","lodash":"^4.17.4","react-dom":"^15.6.1","consolidate":"^0.14.5"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","babel-cli":"^6.26.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","babel-preset-react":"^6.24.1","eslint-plugin-node":"^5.1.1","babel-preset-es2015":"^6.24.1","eslint-plugin-react":"^7.3.0","babel-preset-stage-3":"^6.24.1","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.0.4.tgz_1503710718201_0.08289551292546093","host":"s3://npm-registry-packages"}},"1.0.5":{"name":"@artsy/stitch","version":"1.0.5","license":"MIT","_id":"@artsy/stitch@1.0.5","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"npm@yukinishijima.net"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"2dc1e296bde60637cc5b0f97e04a2ca30d0a69b8","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.0.5.tgz","integrity":"sha512-HgnxtT5/8IfYYDBkG2VHtdXnP55mERlbz3g/OvE4uoevmj+byvxW1yp/g0CD8XVssg0c1HqVUzEWrvjMEnhdww==","signatures":[{"sig":"MEUCIHTDzezxJso0Uy3vwjQrwMuqzFskHS8iLgGfM99qBUk2AiEAtgGbQndnXH4Ip8C8VwfGot0js0jfSDsmnniUWgSeiFo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"946322ccd6603e937fe901b41a60fb35c4ab05c6","scripts":{"test":"jest","build":"babel lib --ignore lib/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn clean:build && yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"5.3.0","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"8.4.0","dependencies":{"react":"^15.6.1","lodash":"^4.17.4","react-dom":"^15.6.1","consolidate":"^0.14.5","babel-runtime":"^6.26.0"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","babel-cli":"^6.26.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","babel-preset-react":"^6.24.1","eslint-plugin-node":"^5.1.1","babel-preset-es2015":"^6.24.1","eslint-plugin-react":"^7.3.0","babel-preset-stage-3":"^6.24.1","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.0.5.tgz_1503711521627_0.9462261693552136","host":"s3://npm-registry-packages"}},"1.0.6":{"name":"@artsy/stitch","version":"1.0.6","license":"MIT","_id":"@artsy/stitch@1.0.6","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"npm@yukinishijima.net"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"34a5ae0e6a28755145512156a325affb0498adbc","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.0.6.tgz","integrity":"sha512-aNfSpCYTMYiLvThv2gGmI6diVLbUMIlh23+jFTdtglGorE1XfcHHGgyS36holg/jugdEx7mMCX3aG0IiEwDYZw==","signatures":[{"sig":"MEUCICNtXCZl7OillxRArS/HV2DxkfZrMrMV/D3r+huo5en4AiEAtC+zIYvAggOsOxRFtvvyQ5wnpt3yvpeVRSWhTuC6FuA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"d6cad763a6dc55207eefbadfe5c93569f7665d47","scripts":{"test":"jest","build":"babel lib --ignore lib/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn clean:build && yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"5.3.0","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"7.4.0","dependencies":{"react":"^15.6.1","lodash":"^4.17.4","react-dom":"^15.6.1","consolidate":"^0.14.5","babel-runtime":"^6.26.0"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","babel-cli":"^6.26.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","babel-preset-react":"^6.24.1","eslint-plugin-node":"^5.1.1","babel-preset-es2015":"^6.24.1","eslint-plugin-react":"^7.3.0","babel-preset-stage-3":"^6.24.1","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.0.6.tgz_1503713392144_0.5523277213796973","host":"s3://npm-registry-packages"}},"1.0.7":{"name":"@artsy/stitch","version":"1.0.7","license":"MIT","_id":"@artsy/stitch@1.0.7","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"npm@yukinishijima.net"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"71aab44fe39bc2e6b0f6081ec66f9637ede780f1","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.0.7.tgz","integrity":"sha512-MQwYNrBsAMhE5lVkrK1ZsYKaWQL3d+TXnyD8rmadD7pHqOkdufEPIpvoJ8tWjgWaUJIO6IsPtmpOCZSKZe0vfw==","signatures":[{"sig":"MEQCIFafV9kmvKMLEJwRsw1BthqzHxf6B0GX3IZ3IvA2UsPkAiAKFcK8frl8wlHzz8U+yMC80R6e/d4wxmQb7zMMkOt/+g==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"32920d93765b942d0344ed9858cf1352a4a77290","scripts":{"test":"jest","build":"babel lib --ignore lib/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn clean:build && yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"5.3.0","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"8.2.1","dependencies":{"react":"^15.6.1","lodash":"^4.17.4","react-dom":"^15.6.1","consolidate":"^0.14.5","babel-runtime":"^6.26.0"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","babel-cli":"^6.26.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","babel-preset-react":"^6.24.1","eslint-plugin-node":"^5.1.1","babel-preset-es2015":"^6.24.1","eslint-plugin-react":"^7.3.0","babel-preset-stage-3":"^6.24.1","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.0.7.tgz_1503775523071_0.08055218681693077","host":"s3://npm-registry-packages"}},"1.1.0":{"name":"@artsy/stitch","version":"1.1.0","license":"MIT","_id":"@artsy/stitch@1.1.0","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"npm@yukinishijima.net"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"2e61d5957c240896b5d972f5ec512739d66d6d80","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.1.0.tgz","integrity":"sha512-NllDpDz8OMcX4RrB6nLPVf56v4qsA6kvMspjDm4vk0oDfZZAWCjWzTOEWOoabgPMbAMpP83euNvZTM+w7HtQ0Q==","signatures":[{"sig":"MEUCIEa8Z8voUNu+gsX4k17vZzogvu+DuckEhPiSwprv5jbAAiEA/OYOVb2mtjNYFvb6MkIya/I55OuD2ijlsuDfxfZBDyI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"c21487a2e99b979db467a729e0240239acb97531","scripts":{"test":"jest","build":"yarn clean:build && babel lib --ignore lib/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"5.3.0","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"8.4.0","dependencies":{"react":"^15.6.1","lodash":"^4.17.4","react-dom":"^15.6.1","consolidate":"^0.14.5","babel-runtime":"^6.26.0","styled-components":"^2.1.2"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","babel-cli":"^6.26.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","babel-preset-react":"^6.24.1","eslint-plugin-node":"^5.1.1","babel-preset-es2015":"^6.24.1","eslint-plugin-react":"^7.3.0","babel-preset-stage-3":"^6.24.1","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.1.0.tgz_1503818728795_0.9737268288154155","host":"s3://npm-registry-packages"}},"1.2.0":{"name":"@artsy/stitch","version":"1.2.0","license":"MIT","_id":"@artsy/stitch@1.2.0","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"db613dbb0035392bf834e9559768bd6222a7043d","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.2.0.tgz","integrity":"sha512-9UlgkJvYHanTVwftHsZjtZBm6Dv8+UeWJeSWI95X4PItpwnWmpHUAdh5gPyPOG+8G1xgicN+WOlH0bRbOudIig==","signatures":[{"sig":"MEUCIQCW3bZXYK2WkmeJGfiQUQTGyc7TFv3ReOgLRi8nwLRT7gIgC2YR1ILHLWehvlqo1rLJQGBfTpR++bFZP3++Xg5PR/o=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"e0941437b0079e2bc5960d388bf46cd4b8357788","scripts":{"test":"jest","build":"yarn clean:build && babel lib --ignore lib/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"5.3.0","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"8.4.0","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5","babel-runtime":"^6.26.0"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","babel-cli":"^6.26.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","babel-preset-react":"^6.24.1","eslint-plugin-node":"^5.1.1","babel-preset-es2015":"^6.24.1","eslint-plugin-react":"^7.3.0","babel-preset-stage-3":"^6.24.1","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"peerDependencies":{"react":"^15.6.1","react-dom":"^15.6.1","styled-components":"^2.1.2"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.2.0.tgz_1508474472698_0.9570356062613428","host":"s3://npm-registry-packages"}},"1.2.1":{"name":"@artsy/stitch","version":"1.2.1","license":"MIT","_id":"@artsy/stitch@1.2.1","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"50aabf8ed75ea593b8db0434176991253bf80455","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.2.1.tgz","integrity":"sha512-/OyEjzRA+2VEG/y7e8uoOXLd7lGYmTQotlj3pa7bir4s/8cuG7KNvghzMS7rBTOJAtufUogef9Q7S4VAf/iAYQ==","signatures":[{"sig":"MEUCIEhERIbtMik6lKHBWkksmQLq1/AIjpqPef35E+8nLfI7AiEA2OxB1kVKap3KEOtGNNmKMGho4qK2mocSRBLs29uDgYQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"d809720fe851c55658ad56003d89e03d3a9a36e1","scripts":{"test":"jest","build":"yarn clean:build && babel lib --ignore lib/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"5.3.0","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"8.4.0","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5","babel-runtime":"^6.26.0"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","babel-cli":"^6.26.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","babel-preset-react":"^6.24.1","eslint-plugin-node":"^5.1.1","babel-preset-es2015":"^6.24.1","eslint-plugin-react":"^7.3.0","babel-preset-stage-3":"^6.24.1","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"peerDependencies":{"react":"^15.6.1","react-dom":"^15.6.1","styled-components":"^2.1.2"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.2.1.tgz_1508474662642_0.15730987791903317","host":"s3://npm-registry-packages"}},"1.2.2":{"name":"@artsy/stitch","version":"1.2.2","license":"MIT","_id":"@artsy/stitch@1.2.2","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"4fa5c4250bfdb1c96dd4c0ec6ae4f590485aff27","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.2.2.tgz","integrity":"sha512-rtalA+OPyyfOPWtKT+nsp8JdDeTPXOhmvSo1SlFQNVXFNrTlxQlfTLgwFm1mDxN2VV3Z3R2OLTglU+FBrLWHnA==","signatures":[{"sig":"MEUCIQDcXdDIVvDALO0qoX56JgcZRLpjRdoNMOEuzEIzkQxFkAIgGj5QBNE6KQt6YgyTImDDt8ItJoyxJJ0e80c2NK/eddA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"b50582f4cf587ce336af0dac52139746c1c9a6ec","scripts":{"test":"jest","build":"yarn clean:build && babel lib --ignore lib/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"5.3.0","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"_nodeVersion":"8.4.0","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5","babel-runtime":"^6.26.0"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","babel-cli":"^6.26.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","babel-preset-react":"^6.24.1","eslint-plugin-node":"^5.1.1","babel-preset-es2015":"^6.24.1","eslint-plugin-react":"^7.3.0","babel-preset-stage-3":"^6.24.1","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"peerDependencies":{"react":"^15.6.1","react-dom":"^15.6.1","styled-components":"^2.2.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.2.2.tgz_1509820903169_0.007024393416941166","host":"s3://npm-registry-packages"}},"1.2.3":{"name":"@artsy/stitch","version":"1.2.3","license":"MIT","_id":"@artsy/stitch@1.2.3","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"dist":{"shasum":"a0974487bb414d5ccd1027c89d30404b767d1e83","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.2.3.tgz","integrity":"sha512-D0d7wuswXV/8uhSZMUYglwrk03zrrYtBKU1wDaRBjy5uTevSSTvFFNqPeoclSyafoiUvQkr50pg6LgukmccQLw==","signatures":[{"sig":"MEUCICOnNo3tEsOSWEBUgsLBmX7uYzLlqdbRogVUMju4TejrAiEAyD2SyH0/MwRUvxM8HGwk3wU6PjBtjm4vzL0i0IZdSTc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"scripts":{"test":"jest","build":"yarn clean:build && babel lib --ignore lib/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git@github.com:artsy/stitch.git","type":"git"},"description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"licenseText":"MIT License\n\nCopyright (c) 2017\n\nChristopher Pappas \nAlan Johnson \nArtsy \n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5","babel-runtime":"^6.26.0"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","babel-cli":"^6.26.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","babel-preset-react":"^6.24.1","eslint-plugin-node":"^5.1.1","babel-preset-es2015":"^6.24.1","eslint-plugin-react":"^7.3.0","babel-preset-stage-3":"^6.24.1","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"peerDependencies":{"react":"^15.6.1","react-dom":"^15.6.1","styled-components":"^2.2.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.2.3.tgz_1509821004776_0.31716162036173046","host":"s3://npm-registry-packages"}},"1.3.0":{"name":"@artsy/stitch","version":"1.3.0","license":"MIT","_id":"@artsy/stitch@1.3.0","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"dist":{"shasum":"428a0cbe67ba5fed55799d3e8d1f99137a4442a4","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.3.0.tgz","integrity":"sha512-o8PGczeWGy36BJpa9OE5WTcvMOFiby4VEE43sQ3EZM1gz0RTewbTyqGtmcrExm4K6vMef1YmWUTQRRnbJzhXjw==","signatures":[{"sig":"MEYCIQDt/aOvVERvO9CtgDckjcFdVfjqCXCHbjuUkg7gwslXKQIhAKRF8TY4RGqoOImWBrswvig7spvA1ZFvGiiqNKOaQM5H","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"scripts":{"test":"jest","build":"yarn clean:build && babel lib --ignore lib/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git@github.com:artsy/stitch.git","type":"git"},"description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"licenseText":"MIT License\n\nCopyright (c) 2017\n\nChristopher Pappas \nAlan Johnson \nArtsy \n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5","babel-runtime":"^6.26.0"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","babel-cli":"^6.26.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","babel-preset-react":"^6.24.1","eslint-plugin-node":"^5.1.1","babel-preset-es2015":"^6.24.1","eslint-plugin-react":"^7.3.0","babel-preset-stage-3":"^6.24.1","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"peerDependencies":{"react":"^15.0.0-0 || ^16.0.0-0","react-dom":"^15.0.0-0 || ^16.0.0-0","styled-components":"^2.2.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.3.0.tgz_1513820279411_0.26814859570004046","host":"s3://npm-registry-packages"}},"1.3.1":{"name":"@artsy/stitch","version":"1.3.1","license":"MIT","_id":"@artsy/stitch@1.3.1","maintainers":[{"name":"broskoski","email":"cab@are.na"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"}],"dist":{"shasum":"ad4eb4c4d87e6ed5c8b35c2bfa6e5b8c2e2000a7","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.3.1.tgz","integrity":"sha512-Y8ZXk4ivmoycb8caxuj5n8kGY4Csh7iyC0HX1fWpRBGY55i3ua2N98V8XBbtqwxTr2caCf7JB0utfBaUs7N0OA==","signatures":[{"sig":"MEUCIEO45LFXeXuoSXExOCrX0nmk6k/TOzb3n5REVfyzOGs2AiEAgyYYUVwHLvm8QGtpM1Qw3fYuLL+lZgKsTrTxuKA8tX4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"jest":{"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"scripts":{"test":"jest","build":"yarn clean:build && babel lib --ignore lib/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"repository":{"url":"git@github.com:artsy/stitch.git","type":"git"},"description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"licenseText":"MIT License\n\nCopyright (c) 2017\n\nChristopher Pappas \nAlan Johnson \nArtsy \n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5","babel-runtime":"^6.26.0"},"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^20.0.4","eslint":"^4.5.0","babel-cli":"^6.26.0","handlebars":"^4.0.10","babel-eslint":"^7.2.3","babel-preset-react":"^6.24.1","eslint-plugin-node":"^5.1.1","babel-preset-es2015":"^6.24.1","eslint-plugin-react":"^7.3.0","babel-preset-stage-3":"^6.24.1","eslint-plugin-import":"^2.7.0","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","babel-plugin-transform-runtime":"^6.23.0"},"peerDependencies":{"react":"^15.0.0-0 || ^16.0.0-0","react-dom":"^15.0.0-0 || ^16.0.0-0","styled-components":"^2.2.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch-1.3.1.tgz_1513834233687_0.734031098196283","host":"s3://npm-registry-packages"}},"1.4.0":{"name":"@artsy/stitch","version":"1.4.0","license":"MIT","_id":"@artsy/stitch@1.4.0","maintainers":[{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"broskoski","email":"cab@are.na"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"}],"dist":{"shasum":"36530e706e8396f0b2694207f6e81c30af0c491f","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.4.0.tgz","fileCount":132,"integrity":"sha512-32fD3qywB21PyzT1kDSlz8MMe2jr0iXDWIsVV30XKaNECJ17P02M0cwgYgmuP37DEiZTR0HU47F7sdzYc0qXPg==","signatures":[{"sig":"MEUCIQCJSnrVvbiNBxa3il5WY3ZpxnSplLthCKR9zo7vRXHLagIgF6Z3+OpM/feXVczMEmMDjel2WkQm3TMJpLW2XdKNN+Q=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":74345},"jest":{"transform":{".(js|jsx)":"babel-jest"},"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"scripts":{"test":"jest","build":"yarn clean:build && babel src --ignore src/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"prettier":{"semi":false,"arrowParens":"always","singleQuote":true,"bracketSpacing":true},"repository":{"url":"git@github.com:artsy/stitch.git","type":"git"},"description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"licenseText":"MIT License\n\nCopyright (c) 2017\n\nChristopher Pappas \nAlan Johnson \nArtsy \n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5","@babel/runtime":"^7.0.0-beta.40"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^22.4.2","react":"^16.2.0","eslint":"^4.5.0","prettier":"^1.10.2","react-dom":"^16.2.0","@babel/cli":"^7.0.0-beta.40","babel-core":"^7.0.0-0","babel-jest":"^22.4.1","handlebars":"^4.0.10","@babel/core":"^7.0.0-beta.40","babel-eslint":"^8.2.2","@babel/preset-env":"^7.0.0-beta.40","styled-components":"^2.4.0","eslint-plugin-node":"^5.1.1","@babel/preset-react":"^7.0.0-beta.40","eslint-plugin-react":"^7.3.0","eslint-plugin-import":"^2.7.0","@babel/preset-stage-3":"^7.0.0-beta.40","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","@babel/plugin-transform-runtime":"^7.0.0-beta.40"},"peerDependencies":{"react":"^15 || ^16","react-dom":"^15 || ^16","styled-components":"^2 || ^3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_1.4.0_1519353084102_0.2716623056627101","host":"s3://npm-registry-packages"}},"1.5.0":{"name":"@artsy/stitch","version":"1.5.0","license":"MIT","_id":"@artsy/stitch@1.5.0","maintainers":[{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"broskoski","email":"cab@are.na"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"}],"dist":{"shasum":"c73a1ddb827664c52f3b8d3e647038446f6bafa7","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.5.0.tgz","fileCount":142,"integrity":"sha512-KHAn8NRxCwzwu8vtWfbd0BCfsAx7z2RI/KpSs599cVNW7qHzn8OtXw8qeXC6+Nk84iMpPDQlL6R4T3kgVz/p5g==","signatures":[{"sig":"MEQCIAL19tza1Hwvp7sI+snCfRqIIiliKqLg+nLg94FoNXSHAiBrLLKqaRSdLaB5VD5/LSL9niBwZ2dNx6B0IcEE2BU5Xg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":85566,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJa37SECRA9TVsSAnZWagAAhDMP+gJlK8BbJWc1uCrzhG1C\nZs3zSyeHlZyxDYjltNC5BP3AwTQqDypyBVnYU8Z1Qo5OQoYSRObCY9fYzsHG\nlxjMAD1esbUyHcvIQOrHm9w26+XopCkMywZLFaou5CMe+/qkVbdeP/4Vb/Sd\np704KGa+ltN7WG/EetgBQk/einIkIdg/lgN0dstfvYAFtqfwi4d0O1jOBMQ6\ngKEE0i0pCaeFvGW2ix5gbDhvUE5rDnFKGTafATn9IAeRIGJaxfccIX4sJY8m\n4W3xsLnPlBlzhCw3idFwZYPMSY1Jvx6HZNJjQvj6nSgrOyQAVd4IowQQQuOb\n1wWWuqma5X4ZDi00mlqYSayVPiM0mAFHf6kfnV3EkP5U+PRUu6b+tJe3SeWg\nW2+bMxAhCTBc7fFSRlURm1AtAf0Re+Gdhkp0o8ECoR0m9giL0IJuinPUTPFF\n+L8hnzvlNHw61HqXQcWSo+42bURRG/eObln/L3SW1rO5LmrcPi48wxoAcBxf\nD6Nn6+yGw+Zbp5/lGCgfVPvbACraLCWi9/y24QN3luyVgir2QAWGmF2DUclZ\no4BKcOR+gQroaPYzNA/jwM639OWCG2XOlTeJKaM9ZxUTLXAMth15a4g+qNrJ\npKo6QWCQG2N68AyNOls/ECRJe80lGKAGyct3WlBEs6kVFo5LHN5Qzjn8/KDo\njSwS\r\n=BQwn\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"transform":{".(js|jsx)":"babel-jest"},"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"scripts":{"test":"jest","build":"yarn clean:build && babel src --ignore src/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"prettier":{"semi":false,"singleQuote":true,"bracketSpacing":true},"repository":{"url":"git@github.com:artsy/stitch.git","type":"git"},"description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"licenseText":"MIT License\n\nCopyright (c) 2017\n\nChristopher Pappas \nAlan Johnson \nArtsy \n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5","@babel/runtime":"^7.0.0-beta.46"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^22.4.2","react":"^16.2.0","eslint":"^4.5.0","prettier":"^1.10.2","react-dom":"^16.2.0","@babel/cli":"^7.0.0-beta.46","babel-core":"^7.0.0-0","babel-jest":"^22.4.1","handlebars":"^4.0.10","@babel/core":"^7.0.0-beta.46","babel-eslint":"^8.2.2","@babel/preset-env":"^7.0.0-beta.46","styled-components":"^3.2.6","eslint-plugin-node":"^5.1.1","@babel/preset-react":"^7.0.0-beta.46","eslint-plugin-react":"^7.3.0","eslint-plugin-import":"^2.7.0","@babel/preset-stage-3":"^7.0.0-beta.46","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","@babel/plugin-transform-runtime":"^7.0.0-beta.46","eslint-config-prettier-standard":"^1.0.1"},"peerDependencies":{"react":"^16","react-dom":"^16","styled-components":"^3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_1.5.0_1524610178185_0.814234450587265","host":"s3://npm-registry-packages"}},"1.5.1":{"name":"@artsy/stitch","version":"1.5.1","license":"MIT","_id":"@artsy/stitch@1.5.1","maintainers":[{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"broskoski","email":"cab@are.na"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"}],"dist":{"shasum":"09d4bb5e9fb4337a45845de44286686e8e618c5e","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.5.1.tgz","fileCount":142,"integrity":"sha512-iL9ugFYwwX5hpU3vUlKtLsCn2qMNodg9otxpgIWGnv8kPxdnDez5rEtEcLZgXEH91utEiUg1BnnWRtyjTehSgg==","signatures":[{"sig":"MEMCH1NTMJAOHDSQRSAzw7YPMI7jNvxUuvIoBYelul0hausCIDueFPAhRZlapQU6HBUDWQ0V3CLIIcc3xdeUdg9tVsI/","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":85478,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJa4hY4CRA9TVsSAnZWagAAYLkQAIYCeNZKXNMag9bXiAuc\n1O0sM43UBoiAbeX5t4oGks91b2cSblBulq1hhUIJ3A3sZH8I9s0jknWL1lFJ\nQuj2kdmnm828gf1RcCJCKOgTPD5YNQ91eOLiddQdfJfBAr8aeUmPL18IOYeU\nT84m83+Fobk+IgJMKXpRZNTTGCAQZiqhd1pN/su5ERiw1yXh3zD1+6BycfVj\nwM25cKH/pVMJ3j/Xe/+vSD73dNA6PUDGpHbLqqodmS1U2iaa5XN9pRQ7RkHg\nqToaj29ro15lmRHb3xLtt/bfMbiPHrR/J67Gt/UzIsfFiCn9mEkRus3ATJpd\n/CBZYguczClYVert9INRdkRy+vlcaHJXDGYNElXp3pMCcwlBf1Xnq/ztE5lF\nZsrpZcj0VDc9TmB/PU8ZZB80OSlUZhkzD9mvayz1sqKAc7fl6ur/MqETZOmm\nwK+IqtJJSJ1o9GlWL11XUq9EIv6Z0kxKVypJKmZjJ+Kqag4HwqwbNDiolOxb\nvLoRY8oIc4cs7RKQgUkp+RkNZkg1lUmYNV1vUq7JPxod/K3JImK/bAMGO2a2\n7JoK2DlRytE2134C1uYhKSU1fVkBLuVNFGLGUV8cv/qLMC1KNSb6pTf5cqPE\ncjriTIs3IUZ985kzJW2CocqKqjF3G7hl3XE4UhZ8mkIL/e6oQkZGnUNmHqds\nKM+f\r\n=XXNg\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"transform":{".(js|jsx)":"babel-jest"},"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"scripts":{"test":"jest","build":"yarn clean:build && babel src --ignore src/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"l2succes","email":"l2succes@gmail.com"},"prettier":{"semi":false,"singleQuote":true,"bracketSpacing":true},"repository":{"url":"git@github.com:artsy/stitch.git","type":"git"},"description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"licenseText":"MIT License\n\nCopyright (c) 2017\n\nChristopher Pappas \nAlan Johnson \nArtsy \n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5","@babel/runtime":"^7.0.0-beta.46"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^22.4.2","react":"^16.2.0","eslint":"^4.5.0","prettier":"^1.10.2","react-dom":"^16.2.0","@babel/cli":"^7.0.0-beta.46","babel-core":"^7.0.0-0","babel-jest":"^22.4.1","handlebars":"^4.0.10","@babel/core":"^7.0.0-beta.46","babel-eslint":"^8.2.2","@babel/preset-env":"^7.0.0-beta.46","styled-components":"^3.2.6","eslint-plugin-node":"^5.1.1","@babel/preset-react":"^7.0.0-beta.46","eslint-plugin-react":"^7.3.0","eslint-plugin-import":"^2.7.0","@babel/preset-stage-3":"^7.0.0-beta.46","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","@babel/plugin-transform-runtime":"^7.0.0-beta.46","eslint-config-prettier-standard":"^1.0.1"},"peerDependencies":{"react":"^16","react-dom":"^16","styled-components":"^3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_1.5.1_1524766261382_0.6197847442395537","host":"s3://npm-registry-packages"}},"1.5.2":{"name":"@artsy/stitch","version":"1.5.2","license":"MIT","_id":"@artsy/stitch@1.5.2","maintainers":[{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"broskoski","email":"cab@are.na"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"}],"dist":{"shasum":"fc2f5f2c73a3a99cea8a15b94cb1cb7aea22b349","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.5.2.tgz","fileCount":142,"integrity":"sha512-ZwrQaLWB4Kj43PzjcEi+Vacqf/+jVFdefOvjDpEvBXTm0xo+Rr7ImY3usfeXJwpi4qaDrMRFDeMEs75ToDvOnA==","signatures":[{"sig":"MEUCIGqePH00HlfkLPZbaRJrQcc2uGYZFPUZ6tWIWWa8liYQAiEApvdsaieYI7NGjpxNhBYp94l3IDQHBDUGvd4XJglHhMY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":85579,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJa7MlECRA9TVsSAnZWagAAzoUP/jR59cEQjRgPqIG9lWOH\nXIHcTyh59KOXrDddIKxatJQefxrEjQ9iMuL1rw0Hadn6eDS/epePoEgGBURB\nY060u20hUGMVv6z77ZGM+eurQGG40SWNGB4Gkm76nMKRPMu3Fr+kTcm3LW9i\nbqdaP7tHAAnyT4BVEt7q6Nq/62HlqXouyDzy4YHcRq8s2WdgTkDQtjdrQM80\nD/9wX7Da3yI4UL9+jFlRtEpeMyvUQ6L/Pb7Ut+61mO0rlhtCvYQZIWDNBM2T\nRppnvKFCBb3thszy504q+3mww7FnKeidHg7SUoRtBWBbazmS0FOOAFkQh6ri\nWHMh2RMvdLuWgp5h6e3lUGhwNfu4j7A7vkoeZg22HOUZx5Gf243NR/m+vd2x\nSqhvxp59QJ5tHncpJ1cCC/hEwqRVwRdHtpxQsuZMBfVSgMV3up0AXuq6WFMv\nMQ5lv24aZM4uVVEO+hZ95f5yBFq6DbxwS9UOeZ4BkDmn7lv69L03k0s1YjoF\nR9dkJwLwS6CaocorG/k5ajtx2PPoeBgvP9OJ7tg9X+Kgf4n8qoVejDC7iEfq\n49EgiwLbFU+hF6GDABv1XWvPExQmir9TK/of4NMrDJE43fozOvyHEOXX2dAl\n1FQLuzhgO/DGUR63/+trFVQxXrFRukmpswnqDR0jqmGQ1hIaZvufu/gJDlOf\nqUeh\r\n=LgVt\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"transform":{".(js|jsx)":"babel-jest"},"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"scripts":{"test":"jest","build":"yarn clean:build && babel src --ignore src/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"prettier":{"semi":false,"singleQuote":true,"bracketSpacing":true},"repository":{"url":"git@github.com:artsy/stitch.git","type":"git"},"description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"licenseText":"MIT License\n\nCopyright (c) 2017\n\nChristopher Pappas \nAlan Johnson \nArtsy \n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5","@babel/runtime":"^7.0.0-beta.46"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^22.4.2","react":"^16.2.0","eslint":"^4.5.0","prettier":"^1.10.2","react-dom":"^16.2.0","@babel/cli":"^7.0.0-beta.46","babel-core":"^7.0.0-0","babel-jest":"^22.4.1","handlebars":"^4.0.10","@babel/core":"^7.0.0-beta.46","babel-eslint":"^8.2.2","@babel/preset-env":"^7.0.0-beta.46","styled-components":"^3.2.6","eslint-plugin-node":"^5.1.1","@babel/preset-react":"^7.0.0-beta.46","eslint-plugin-react":"^7.3.0","eslint-plugin-import":"^2.7.0","@babel/preset-stage-3":"^7.0.0-beta.46","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","@babel/plugin-transform-runtime":"^7.0.0-beta.46","eslint-config-prettier-standard":"^1.0.1"},"peerDependencies":{"react":"^16","react-dom":"^16","styled-components":"^3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_1.5.2_1525467458762_0.8036838942014728","host":"s3://npm-registry-packages"}},"1.6.0":{"name":"@artsy/stitch","version":"1.6.0","license":"MIT","_id":"@artsy/stitch@1.6.0","maintainers":[{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"broskoski","email":"cab@are.na"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"}],"dist":{"shasum":"7b53b51002930653a8044a0b79723a16a2b20aad","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.6.0.tgz","fileCount":142,"integrity":"sha512-ZGvo9GbKzQ24D9e88KirZpi3TCfOy1D+OLPuTT7vUm9Py634LWHFRfMN6EpktKtKq6t2O5WNlC4nS4u4sh8vDQ==","signatures":[{"sig":"MEQCIHFepFUyLVJSmHB0pULXvziuphYzcEl8Jb1zLwuhOjE/AiB/kCWnR6s7IhdL6jJYnKrHBGI+R1GiH3sLvEPbhvWMdg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":86002,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJa7O8yCRA9TVsSAnZWagAAtSEP/0zULQ7ELD3Yt3eTgN2b\nJikQljnUt0tc318Rcmg0lRaW1OnX85M5suIV8XunqOuEiggzDjBa6JZMV3SR\nly5vPt22h+pIJh2xmcPvrFxvI+pHmk06UP3KrlRozN0McqcSmSZb8jUQp1ZX\ngNx5Hpn8s7Umgq8tVZWJZCZoNrZmCLUUcnv/nr3KFHFhBc3xMwvsh7xYKBK+\nqiEQcKdiJboConOXl7UupJWl9DU/r2Q2JFwhME8pZy4t2id9D1hakDP7CdD6\nKzdK1kIYHSBu4QJipxx+Y+DtC+bB2QujTziryjAMH9j8i+RWcFY9OfOYgzLO\nKdnkdWZ9GlRhDQRhZJpM6DJbgxAz7pH6P9kALHOOytQOzN4k5M/2x2Ww1zo5\nk2MR1uYWuWQkWIsQjv3IGvzwkG1b0Nn6BrTTHyc2mDwTbo5I9xRU6f0/5pVC\nTHqpOl1mw+1Zos6ZM57pfQjFVHjhGREsbDWR6kdHlKbpffITlAPmToJzHhU+\nmh6wJ1II79nQt7Woq2hZ5yrhq2hT6qLJbXasl8jZHNJtyKxz8eexbzkqaT7D\naj6F0aDCEygKN3fVcSVuxgtjb5fZnb+/6TgJ0RdHC1Qx1c6oh3YE6wmpSRJ/\nE/lfnRzUaXps0PDlHt5zZS1zTwlL513WSMjTMECnSqwXYL8I1OHzdO5iwcZA\nOArH\r\n=EzX2\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"transform":{".(js|jsx)":"babel-jest"},"setupFiles":["./.test-setup"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"scripts":{"test":"jest","build":"yarn clean:build && babel src --ignore src/__tests__ --out-dir dist","coverage":"jest --coverage","test:watch":"jest --watch","clean:build":"rm -rf dist","prepublishOnly":"yarn build"},"_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"prettier":{"semi":false,"singleQuote":true,"bracketSpacing":true},"repository":{"url":"git@github.com:artsy/stitch.git","type":"git"},"description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"licenseText":"MIT License\n\nCopyright (c) 2017\n\nChristopher Pappas \nAlan Johnson \nArtsy \n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5","@babel/runtime":"^7.0.0-beta.46"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^22.4.2","react":"^16.2.0","eslint":"^4.5.0","prettier":"^1.10.2","react-dom":"^16.2.0","@babel/cli":"^7.0.0-beta.46","babel-core":"^7.0.0-0","babel-jest":"^22.4.1","handlebars":"^4.0.10","@babel/core":"^7.0.0-beta.46","babel-eslint":"^8.2.2","@babel/preset-env":"^7.0.0-beta.46","styled-components":"^3.2.6","eslint-plugin-node":"^5.1.1","@babel/preset-react":"^7.0.0-beta.46","eslint-plugin-react":"^7.3.0","eslint-plugin-import":"^2.7.0","@babel/preset-stage-3":"^7.0.0-beta.46","eslint-plugin-promise":"^3.5.0","eslint-config-standard":"^10.2.1","eslint-plugin-standard":"^3.0.1","@artsy/express-reloadable":"^1.0.6","eslint-config-standard-react":"^5.0.0","@babel/plugin-transform-runtime":"^7.0.0-beta.46","eslint-config-prettier-standard":"^1.0.1"},"peerDependencies":{"react":"^16","react-dom":"^16","styled-components":"^3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_1.6.0_1525477168388_0.004278273248927489","host":"s3://npm-registry-packages"}},"1.6.1":{"name":"@artsy/stitch","version":"1.6.1","license":"MIT","_id":"@artsy/stitch@1.6.1","maintainers":[{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"broskoski","email":"cab@are.na"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"a4d08192ec9ebce96ffb6fcfdde32066ed0bb384","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-1.6.1.tgz","fileCount":31,"integrity":"sha512-/5m62HguPRvpTiRz/WKSL7pFCDOKNQMvkbx/iscskW6sSJB6u/YrBpiaVKrdGpZnp3dahx6lIPPG6SNBSw/QmQ==","signatures":[{"sig":"MEYCIQD62ZIomrUMAoCclHP3pdn7uHXAzZ7QkfOEh/BUd55KwQIhAPmExclBkJYFGKY/UdTK7WSfCdriKEwqrw4ypwBHou/9","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":76357,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbsqJhCRA9TVsSAnZWagAA9dwP/RmH2Z0Ty4fNDngFmf45\naf/a68xY/ilg0HK5MQ+bygzwR6ylTCXBHnJx8xvsKzc1+d/XW51PwLAPFP96\nsXnlyf2Pic8tXVzjLBomtMhpPjBbpKYWqpaJVsx+JIuZEZ0RKYAcRis48B4N\nKCf9dHm6BzLf/Ugrb90i8XA1yh2+iVp2RstEnSil4LVobwp4b1LrJWuvqduD\nJbH6/EBTNRjlaRuHMi21j3xNEzF0BtiSUAVupkP/EyFj5ZWDD/g0k0Gf1gbH\nn5R3+hTs8UXoPFDUyLxUX5uY1jaw1EaaFGkDQDHxDIDxwKz+4yBRvr4LKglD\nXNChMPteyItpqa9NXwKTKQPzgnbd5aNgWzYz87MovcBq3vUosPuteJfz9/ad\nw6kg6tRW+Tx7VAckEmhY387KMKzoEyP5Pmo0pY8Le7LRoHSpKRfmgsw3GrZL\n79TnK/zB3MY3ebM8ysNzo+AURBcUyyn1WEBtrvW7hHkWOD3i2/jBv+ojfOu7\n3bmD3AXl6GvwBeMA4Zun2Yy50+4Y4BZKDXqB6XKWv5ljeLC6r7igm5gHK/P+\nXXwZzqiOnnnfjyjbuGONnFqVpU3cOp+4WXHi4U1wBFKaQVW3bkGJSSqaGy2Q\neuqm8pxgYjmyFKolrf7L/pDMTfi2WPx3w+cUMgTkfKvhu8EUi7RDoSfLdeDL\nM2bv\r\n=VZXU\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"9919b243683d34c089ebc88e7ff62eecff1d3862","release":{"analyzeCommits":{"preset":"ember","releaseRules":[{"tag":"DOC","release":"patch"},{"tag":"FIX","release":"patch"},{"tag":"PATCH","release":"patch"},{"tag":"FEATURE","release":"minor"},{"tag":"BREAKING","release":"major"}]}},"scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","semantic-release":"semantic-release","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"8.12.0","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.5.0","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.5.0","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"^16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","semantic-release":"^15.5.0","@babel/preset-env":"^7.0.0","styled-components":"^3.4.5","@babel/preset-react":"^7.0.0","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"^3.0.0","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"^1.0.6","conventional-changelog-ember":"^2.0.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"^3.4.5"},"_npmOperationalInternal":{"tmp":"tmp/stitch_1.6.1_1538433632813_0.5883124718305435","host":"s3://npm-registry-packages"}},"2.0.0":{"name":"@artsy/stitch","version":"2.0.0","license":"MIT","_id":"@artsy/stitch@2.0.0","maintainers":[{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"broskoski","email":"cab@are.na"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"c0a44186b3eac779bd3c7a6b0030c7ad7acff754","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-2.0.0.tgz","fileCount":31,"integrity":"sha512-7k5wf7+5lE57aVF0Ep5QyVEQSEYHdLHIuTJxz5syWEq6C+F5m45x4nqKBz+ZmpU8P5oZkvFv2TbEH0DMVXYOGQ==","signatures":[{"sig":"MEUCIQDRxYG9tqRaMX2RFTxSd1EB28SR8x8Eosts3b8KuraMFQIgIOkbOETc3xSClxHKr5AQ3y4gGZmSJ4PoPP5mIoXZZIM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":76357,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbsqeUCRA9TVsSAnZWagAAfeQQAKF5vT4FvoXcnmHk+bz0\nnmM5t4Tn5gWQzABNiUR41YaRrt/qrFy/sW/be5fkuTgx79T+SOu+/EGRCpoP\nhFyOKEeC2PXjzr3ilwvmI0i9P2CduxC6O4pkOkiZdjpu+RL7CRca9XWj87TG\nma1Yy+fzb1t5PSu5/xztd6MtXrL7mf1cO5LE/BwIUq9AnN0j5GbDFwlcjrIk\nmUBL+l+kaLVxT9dSmlm1ZerkG1uuFKxo+fsQWtZAytRntl1vaIHB5sIHsDUv\nvzSp3a9uKqYDG9y/PgXSNZqGfDP83IUTkcdkvgzqjOpL+zDglx/2XPqtdg2q\nGH/EphElnW3SHasozqCkSiyQvUSWt2WepA+lUamaxieRiBBDk4p2Irk98uZ2\nbXFI1rHow2a8ZDCKsig4SLnVuLnChfHCFEGW1CKud9pI1ZbzYTcVCc1/foa7\ntzrJtnsN24leVmcbW+2vCL9g0VhfqcySht6332ghuI/UmSv+thFgkutBX2/n\nLmwlcfHntnonrYbG09DhN8QHJoeFAVBVaDA8oSC6H3w5F/NpJ9Etn4GseTBp\nV5XzTqhGGvNm+FcjlzfvWqKn9KMKGwo8x5qr5vHySdKuj08gPmau0D1HfZ3N\nuPS2Z9WNDSJ8kxbc3Zmaeiyj76T7oLxLwCCmEjDZj9Wh1OJezPzeBJe0u/Eg\nF9hu\r\n=Qse/\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"a3279e9e87b4ccd0e64f9a0a2bfc389bf68fd730","release":{"analyzeCommits":{"preset":"ember","releaseRules":[{"tag":"DOC","release":"patch"},{"tag":"FIX","release":"patch"},{"tag":"PATCH","release":"patch"},{"tag":"FEATURE","release":"minor"},{"tag":"BREAKING","release":"major"}]}},"scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","semantic-release":"semantic-release","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"8.12.0","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.5.0","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.5.0","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"^16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","semantic-release":"^15.5.0","@babel/preset-env":"^7.0.0","styled-components":"^3.4.5","@babel/preset-react":"^7.0.0","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"^3.0.0","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"^1.0.6","conventional-changelog-ember":"^2.0.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"^3.4.5"},"_npmOperationalInternal":{"tmp":"tmp/stitch_2.0.0_1538434962881_0.09960085130248664","host":"s3://npm-registry-packages"}},"3.0.0":{"name":"@artsy/stitch","version":"3.0.0","license":"MIT","_id":"@artsy/stitch@3.0.0","maintainers":[{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"broskoski","email":"cab@are.na"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"ed307965d4da4b3cf2bcd6893c212ca33ceb37c2","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-3.0.0.tgz","fileCount":31,"integrity":"sha512-V8JguXTjyKcG1g4qX5QGvwXDOQtGPJ0M22qYJV5JN97IBxkH+cgjBcyKEnOMrtVgVE6XrOHdzHm4qXGSFrMMkw==","signatures":[{"sig":"MEQCIHn6T0dQ6oiQIR8JE5lyzENfBegG4T99cQyIH0QJR7AvAiA6dH/LQCuCm290fVX/p5DUZhuTlIn+wzlhpsH+lbmNeA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":75758,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbtBzqCRA9TVsSAnZWagAAhBEP/iYibjRxICcyVobs4Mr4\nqqQKmbyRi4sStosoMS63Ol4kAtJFfhgN9httoDOVdCr5/Irpe9wEvywL0NCc\nGwycFMC/brZ2xTQCKt1B9tB97OsUm6ExDbIvzdxlC/gpuT2rgW4MIjMRhzDy\nbUE4AH4L6GdTwCfT40P8RhcSJmaIJa+AKt/e5gWu3wUBCbWXkBrueIuhVf6O\nIeOiUWjzI5jPQkCx3eDPWKt3T6+UO2tG+bcraxXqhwlt3Jk7DWX0MhHRN4Kw\nsml4dAwjVPTvPIqmeCtCqllwFOS0U0+kq7x5doyFuY/uXfTwANByuL7KhJXi\nS3fmYqU1jzP0SlSypyRgns11y7ZfxgcHs31q1Ln61F9+uVcCy4keBu5O4L1/\nbux+VtLWh02fUT57/lzj13/UsQt8f7llkoKcpHnyXoQWCk+D3jk7GiVEYeOC\nMyomQsYZMwJgOJSS6xzh9m4tZWATVwST23IiyoUabl9F825FxG2LuOVbU8io\n9VBaTZ+o7OL1tWcs9y3GoReVIgXKgFNe8GXay+SviI7n0vvMDpIdz9lwsRxn\nvqBachTyLEu+8cOxwRc3Ll07CvAIUea7tmshJnvi3zoGrJp1vvZdMRZwVs3Z\nlPlwxAs4cW2BAElBSGdmPWp/hmd9Jhj/0UODgxF1G/FC1vQP2iBDTZNjnfdv\n2vMU\r\n=p8In\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"249aea0452e779acfa20d64610aca642a8eaf83d","release":{"analyzeCommits":{"preset":"ember","releaseRules":[{"tag":"DOC","release":"patch"},{"tag":"FIX","release":"patch"},{"tag":"PATCH","release":"patch"},{"tag":"FEATURE","release":"minor"},{"tag":"BREAKING","release":"major"}]}},"scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","semantic-release":"semantic-release","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"8.12.0","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.5.0","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.5.0","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"^16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","semantic-release":"^15.5.0","@babel/preset-env":"^7.0.0","styled-components":"^3.4.5","@babel/preset-react":"^7.0.0","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"^3.0.0","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"^1.0.6","conventional-changelog-ember":"^2.0.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"^3.4.5"},"_npmOperationalInternal":{"tmp":"tmp/stitch_3.0.0_1538530537551_0.039322973239157344","host":"s3://npm-registry-packages"}},"3.1.0":{"name":"@artsy/stitch","version":"3.1.0","license":"MIT","_id":"@artsy/stitch@3.1.0","maintainers":[{"name":"alloy020","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"broskoski","email":"cab@are.na"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"gnilekaw","email":"lance@artsymail.com"},{"name":"kanaabe","email":"kanakoabe5@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"6ea39eced27a8323c760f328fa966a0e7442bef1","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-3.1.0.tgz","fileCount":31,"integrity":"sha512-uTgB9wnmgDUsN1DZLZqqiBibTMJbf96VjY//xG038/iEuoGbvzE+fAL7ZSv1AK3QmIagp/UXLW7x+h72tc1knw==","signatures":[{"sig":"MEUCIQDRTfI95PVw8fIu4iHcST70mhsf6FoYKGC283Qjks4Q4AIgSKWVNusulTvRKTuV03o50ee0GBVX1ID/Ys/iPs2D7rc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":79199,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJb9kZ+CRA9TVsSAnZWagAAHCEP/02XtJIWkKODmbwSQYnY\nl/tnGlijj2SvPmWiUbiIZPcPyvkP0D4/ssO3x+GM1kVNuJG8FKp53skUepmX\n9/DtPOXYEyaqcOAjY109iEPArrj0aFb1t3vdeiCmQkRdi6J/KPc2CM7NOWvb\nqFmd5QlC0TyI35YEWzvyH6bM++aj9r+dHii7cxSDZURzggjFmaxTCqaRX2OV\n0S+6iXqs9xeLtnASDlXtqGYI7pFvM4Aotff/V74w/bfT3Rng4SlkPyBCPYIc\nZeNvNGSippAx9XvSwOFr3hI3lrkdwIxFRm1rlTUd0NyMNhETgUHR+Ua116wb\nHQjP0r/+gkCNARwcH6v0HwUHk7MgYeyS7p218QCJYFSZUQwQ8p7dBUg7Uvf2\nNeMfYdi5om/QthN9OszUc0j5PwaGlJpEN+t8gbGEucuF22qcEWK2sCeNPXYh\nfZveLnD0JAQDLP7Nh+M3Vf3PR2r4ZrotMHG6jkr61vmNyz73LgtK5mONt5rS\nqTulmGIEFAQW6uUmNcuyccdYgZyFu/gui6lNBIReGhUJuOK7y919uuM0x0mf\nsjc/uKrzAsMKTX+HjTEEejacC3p3Wr1I9tQ5tyBLESL6eWqdJmoOH/LlX7+7\nkfZFqi/ASRKoXJ6OBW98ereCrG8l6yTwBKt7/kxgCqbMf4d1Q7aY7ikjQFb+\nzXxG\r\n=KjwC\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"8bac7d4e617d131bf03e1953560ab71215636cec","release":{"analyzeCommits":{"preset":"ember","releaseRules":[{"tag":"DOC","release":"patch"},{"tag":"FIX","release":"patch"},{"tag":"PATCH","release":"patch"},{"tag":"FEATURE","release":"minor"},{"tag":"BREAKING","release":"major"}]}},"scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","semantic-release":"semantic-release","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.13.0","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.5.0","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.5.0","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"^16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","semantic-release":"^15.5.0","@babel/preset-env":"^7.0.0","styled-components":"^3.4.5","@babel/preset-react":"^7.0.0","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"^3.0.0","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"^1.0.6","conventional-changelog-ember":"^2.0.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"^3.4.5"},"_npmOperationalInternal":{"tmp":"tmp/stitch_3.1.0_1542866557219_0.9461047367629625","host":"s3://npm-registry-packages"}},"3.1.1":{"name":"@artsy/stitch","version":"3.1.1","license":"MIT","_id":"@artsy/stitch@3.1.1","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"2d82d38b0415d88af2f07c66d94894210262dfb5","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-3.1.1.tgz","fileCount":31,"integrity":"sha512-kfZNmqRbW4hOWLC2QNA/zX0GaJHabGzfJY6HQwdv2Oi1VbTt9Qli6GQJb9MrE9Ware7Eio+5ikeMetIx36sg/Q==","signatures":[{"sig":"MEQCIGTUdLtlLI/adgWbVb3401EDyQDy+VyaF/w+vJHp+FeVAiBSv9zxGtN2h4s2PHvwL0oT8yV7Y5WJSowRErnFlgMsGw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":77984,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcMaYfCRA9TVsSAnZWagAAduUQAKOGjfrc5Wu7FPbBCxv2\nrDp9wh0pwut6u2kpeVoSIAbn1r1HyggzZSJRddPa+YfY6x6VXMn2IGG7BdEO\ngtG36HKixmEz66FN7RWg5CIDENebsSwQFc93uk3EQ5bFYsyrIyglUEqQO/0l\nPieZOQnJNWycI5EWzDwHk9mm0DYGsLLVcwQLeQ4utKOv9w3b6VUp6hWS8Rgs\nrIbzh3bdFuM4hoAHqkvbmw/COOuE6zc1R5V3Vt2HHrnA10i4RAJM4TtvZprp\nNpoOZu+55lfCtU9HYDBI+5ElkJjh/oYjbyZp3/Ak6PX0Y1D0yOqyKYBAnfjy\njsVsOcYspl0gmZVbnqRVbjZYs8UgT8hVpyftMr6pOLo837/HU8l0Sl4VvjWp\nz3HDzEBg/HPrDOQ5VVaG5uqCMU5Tyj8zRDcXGbSspNIZn/rP4nOmUOqX9btd\np7tWOOKh4KJsXO9MZxqTazhNqulBSEplQbooB5dVqnZxS3Ax9AuhdSh2awNB\niNZdEq4luMkzwSQKhecMT+mDokZdDIEM5KlhGV4HQ/pPATPKlsmkNT8eEfxr\n7S030j38ZA/fgCdIsyEZKl2ZxH4NE/iI0F+CAKE9AVbolcNKHbe8Z00bx1lo\nCZVP6fVUsN+1ZpEyN1IlsVJzX3lFRdVExAnxpxW8rd5TS8raTt6vnsHe7Ep3\ngcPz\r\n=Z9iO\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"0bf543c340985ab726ffb75cd1f9e97d42766c95","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.15.0","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.5.0","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.5.0","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"^16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","auto-release-cli":"^1.0.0","@babel/preset-env":"^7.0.0","styled-components":"^3.4.5","@babel/preset-react":"^7.0.0","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"^3.0.0","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"^1.0.6","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"^3.4.5"},"_npmOperationalInternal":{"tmp":"tmp/stitch_3.1.1_1546757662768_0.4408328116174969","host":"s3://npm-registry-packages"}},"3.1.2":{"name":"@artsy/stitch","version":"3.1.2","license":"MIT","_id":"@artsy/stitch@3.1.2","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"931e82cff65de4fbc50934d9ba227e4d18356a30","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-3.1.2.tgz","fileCount":31,"integrity":"sha512-OILYKB0IgPKowlbkrziTKUO9RFq2KOyRwGts+gRB8SEg60Ls8ut9ZCVlSKs1j6ijxN3HsJKQDIT22GIO8qQWcA==","signatures":[{"sig":"MEUCIQD5PHm/5C+2po0tzuP52S3RLAiS0z8gGj7k9zbHXnF48gIgaTqnE1bKtHc0zoI2fTbkew5863fF1nYiUQ6EP2iScvk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":78016,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcNFCwCRA9TVsSAnZWagAA6ZIQAJII+MIMBlsbzNfA5pKA\nM/SYNjrws4K/Ym9IuDUymZl1ZmSwopQrsUPp9UbLkF1UHl50NiECpTdSyRHD\nIWQKIi4aS75oWmSyxQq7AXZHXFb4ZvpSfumQn4n41uyUHLHG8b7bLXqFQKZG\nIb2q3n3XO7SIODkgohrGdu072k2HMWfWJC6aYCFYfeA/MTq6UWXTNaD0D5W2\nrrc6GfggSgJwI/HsH3ptRbwBA9puqg7XChMeXKuSqzPVOvp18U0z06YwFdbt\nkyV4HE+eBQ2EJ67AHcsszVRbeKbpmln/HqwfvsiwJWd/SliMGwXczVWkq+bu\nyiNsOcBjvI1BTE2OlJGdNY5aD3hd4eqHDrXsHXhpodT75rixC1+PMpurtnN/\n2cqMzuI7Tz9JUKgm7zScUO6tS5EvltOSd6A+PhY0xRoQBCNL1XTk/WSgqc5/\nVdrnFkArRJKWD6y2TEJMbtAkTJ7s9bk4KSs15n+UghZmD+ORAg+94MMoeSGn\nMi99S+tMeHUNp36QDifrdHJlvqRkDiG3a2VOVg2lJOXNEqJ+fIZfx8js4+Y1\naoLm3fK7deJBN4z2UStHOAWHhNYciThBm5FVAhsF4/XPulxIftnoFrvaIVRH\nT2lK3UG+p9JY1H1NwiJi+Oi8jOeUzlxGVVQ0Ug5EcX6bZ6Q3NGqU4XtWMIMm\n0Cma\r\n=hANZ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"b59bb53a05677a7dd7d3856f7f42bce9900ff4a4","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.15.0","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.5.0","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.5.0","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"^16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","auto-release-cli":"1.0.0","@babel/preset-env":"^7.0.0","styled-components":"^3.4.5","@babel/preset-react":"^7.0.0","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"^3.0.0","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"1.4.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"^3.4.5"},"_npmOperationalInternal":{"tmp":"tmp/stitch_3.1.2_1546932399899_0.6603012697854429","host":"s3://npm-registry-packages"}},"4.0.0":{"name":"@artsy/stitch","version":"4.0.0","license":"MIT","_id":"@artsy/stitch@4.0.0","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"1e6a7fbda542dd2114de49c540761d16195b1826","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-4.0.0.tgz","fileCount":37,"integrity":"sha512-eZl5jjZ3LYqt3pkFypeMQKUWtsg1FTAqhxprMTAyNQyW974mMPHRx5gdx8Pe5OvtDhphK1HcUJxiohbtbctZbQ==","signatures":[{"sig":"MEUCIAT6NFkFv47aCKD2qnT/Eu/wBNPx/vXr+3jyefF8IoH3AiEA1oiMKdKcP2qiYDzUEKrsGWI8857Mq+Qb64Yz/nhlHTQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":84212,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcNVb8CRA9TVsSAnZWagAADVcP/2yjg8wEnbMVumMyu8lB\nz3PG9NkvvNsZrcK2uevPVcJ7ZwvqEsNgHnZUbpOPTLP4CF5SSVJ/ztbU0B8o\nNf9BGuX88kFvpbxQ4MgVrB2t/Ozycf/nVz9pkDMWKKaJYkmhDPIGEXnhtCsN\nxZYcaheKWszPVCtphRP3QCmfq2pL8rzM3m2FV+goqXQIOlgUqcZxKgXWw4eC\nKc+cDHXTSYPt2TGi5pGixuMx8wthc4gbvk4OVP3KK8v+uGpUsOyW8nZhc7jm\ncS0h74j2vllQHcxA0ZvKLtkSQtBIgrKjDnAxWVeaYuUc2IlGLVKWRZpdEysm\nkN+D4YLTtM3+85IfdLPoU2HpSrgM9xTLnLOa0/D9P1SAcV+17axRVb2uF0GD\n1HzXeFUam3wXkVgIgedwlKxjH0UvqpG9C4V6nzWMLeYdd4GrxjVBMtpohLvk\nhnOSUOpPTZfu4Iwt32Rvmcl2dtgMGag0sIr9eRER2EBrb8DGABGI3JkGe/YU\nLh51tyoIbuWgnjDbLNsJJz6Da1u+vp5uwOfnLrhFPbDKCPEKdevKnaMEymXZ\nmnXO06LaD0HSaqkSyr/SBYnccxRD7JUhRBatLUYVCHtJGDfwY9tjAyUrZW1E\nE2IjOWRbSLBemeS/pId+lx+MabDZkuoBvOjfKrEyIyZiecGXhiz5En/OE4sk\nnmbk\r\n=TKGY\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"79737e11539f84712ab5c6b266103cb0c9b8976b","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.15.0","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.5.0","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.5.0","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"^16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","auto-release-cli":"2.1.2","@babel/preset-env":"^7.0.0","styled-components":"^3.4.5","@babel/preset-react":"^7.0.0","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"^3.0.0","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"1.4.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"^3.4.5"},"_npmOperationalInternal":{"tmp":"tmp/stitch_4.0.0_1546999547228_0.19115438878330626","host":"s3://npm-registry-packages"}},"4.0.1":{"name":"@artsy/stitch","version":"4.0.1","license":"MIT","_id":"@artsy/stitch@4.0.1","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"445977224e54aa76ac5e96b02ec77e5a61f21c26","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-4.0.1.tgz","fileCount":37,"integrity":"sha512-kR6Q/NQPobtLGVXsrtDBV+dgbiwTk/iAToDq0HW7IFGVsGHxA9+/PETx+cAkTQ+tb+3iIamT3ggU6lh4s1yhew==","signatures":[{"sig":"MEQCIELNECu6pmd6U8pLrOphDtfIjq6kfNV+bgjNzMobk+M7AiBPaqBYkXA/M0Ijhc/gVcoekFMpevet8DDffhtDugoOKQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":84410,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcOTW5CRA9TVsSAnZWagAAaY4P/3myBnoWH+etlGex4z5B\nv9nh+icyFS+Cgq5mNb2Quutfz7XsdAn/Yw0bLn/yYG3/fO3RnXNpTz/C/7nZ\nn6LAtucb/FF5OvO9DNpPjggs6aEXKwgzDieN7LSxtFCi4aqoPRcuSQy/mdsV\n4wePsvvNzdVEd2UDy2n7MtSq5EbfpijJ2LhrOrrKanwiR7D8wdduI8r+zWBH\niQNOgHjjHAImmqc2RidcUG51sRbV14piWKMj2BgUSnL9aZ+6NzqVHPACdkAy\noEYLQvKsP9O26s7AhdE0U2xsyI2S+VFcWzkTnJlqD0qW8ws1ov/d3Oeh/dSs\n91i+uaJ/ORDC7aXh3Ar7JYnbBgK8ICoqOcE86H/2+yLM4xSLkK1+HVUG7hEY\nazke4cwUcqU4Tw5hUyPoHwgteINNZ1haJqYi7uVSeczuGzqSH/K/v//R+CjM\nYd9yN+spr0/nOZj7TaJePXxY7jgI9m57Dqm7+rSx+GS5VON3P5uB4BXE7o9Y\nT/yHLpjLua3QOfqnZG+R2mx8QrmJTs6E/xOZ+6k41t7VQCoyxZCMvhhnYbsk\nQDXVtrlVvOvnnnsto8gkUxhbaK309ZXmev1EejJHDX7J4tsxHG59h7xwp15W\nFMFZMyWWGjXDCTfJ21fV1laQycYAIODcBLZrMiIfzNxw2pDh7M/cxVC+8aXx\nn0tz\r\n=CbJn\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"c7d6f6413c0f0517cd9b158da2a89b0df9bf7f2e","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.15.0","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.5.0","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.5.0","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"^16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","auto-release-cli":"2.3.0","@babel/preset-env":"^7.0.0","styled-components":"^3.4.5","@babel/preset-react":"^7.0.0","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"^3.0.0","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"1.4.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"^3.4.5"},"_npmOperationalInternal":{"tmp":"tmp/stitch_4.0.1_1547253176474_0.810838304663124","host":"s3://npm-registry-packages"}},"5.0.0":{"name":"@artsy/stitch","version":"5.0.0","license":"MIT","_id":"@artsy/stitch@5.0.0","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"696505cbead4683418a1796818838399998c45c2","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-5.0.0.tgz","fileCount":40,"integrity":"sha512-Up02PsPWQXgWaij6Zcd77N2kBHoc+Abx4o3eG6fEaON0FrMyMtCFKECvblbcn+R1sdCu5Zle3dKDX4Ldwy1Nvg==","signatures":[{"sig":"MEYCIQDRGy28nR1GIxaCa5tKrdAlmJHftVZ99U6LXNgFvtQ8oQIhAIspeWc/aGark5x5BFnRmp9SLiScNIgJx2OYTwu6Z3jU","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":84443,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcY14lCRA9TVsSAnZWagAAB6UQAIq5CuaKniEr3yLRIp4K\nABoXrV1k3Uwmu607fraGy3YBsaSQ3X/Epi5NkAfFF4AoUPd+H0hRK84bx07v\naO2Qax6MxI3GeMADko6qmzHJwG92h6h5arzzjext0j7zkUb2acGAW+HdzVaa\nr8EHQX8xLrgUjhfePDMTHF+4mKbjLn/924EnBEgEKG2PmWJLi9XKWWI29Xq6\nhXEwqNLPs2eKWVY8B6+W6K2QNLY8LbnZoLYZQlkyoA69liOEpOwjfboDha20\n8rBrjHmOv9dr6JNOSpwW0R/UKwl/aApF8dQmKgZnNrbkYW05/6Y41OX3zLhX\nU9KUpFEhjIoepAENeg6i+lb1aPlseNwlx74uOp90AyWNHtEUwYOwecq8gxHX\nUmO6iI1iT6R+QJe8zkr5T/ZSttodY3s7h+4shM1ojyFL3MiEqHhJnZZsOZeS\nqnZ151THi8SyyTzM3dREgRacmwEi06GWSRgLwSYTq9ejY5Z5egG3rSoo6KzX\nP/SSVSgCyE4tsKzE97vGwlear2AAlRr+pS4UYvGj7eo5uhFeLyMUn/6OIEQ1\n40uryCP0OEfIXiDM95SmXSYzxxgHmnvl6MyFvlM9S34ws0Ypupjrfa+M+iI1\nGRp34xKgxStNwC3R5P2YQLdlPHyUNSBSCB4ftp0LDnQWtbIqzyk71lbUCACf\nzLTz\r\n=sYGz\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"damassi","email":"damassi.pappas@gmail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git@github.com:artsy/stitch.git","type":"git"},"description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"licenseText":"The MIT License (MIT)\n\nCopyright (c) 2018 Artsy Inc.\n\nChristopher Pappas \nAlan Johnson \nArtsy \n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n","lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.4.13","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.4.13","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","auto-release-cli":"2.3.0","@babel/preset-env":"^7.0.0","styled-components":"4.0.3","@artsy/auto-config":"0.1.0","@babel/preset-react":"^7.0.0","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"4.0.3","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"1.4.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_5.0.0_1550016037165_0.692503637262198","host":"s3://npm-registry-packages"}},"6.0.0":{"name":"@artsy/stitch","version":"6.0.0","license":"MIT","_id":"@artsy/stitch@6.0.0","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"6d549af5a5e6f8f134b02f4f86ff63e03bf194d5","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.0.0.tgz","fileCount":37,"integrity":"sha512-nR0I+BlA58FPm/bak0kr41V618suJ9hx86KXb4SAL1sVy5qiQGAVmlNLX5YlZDqVDrrivTci1v+kBtQT2kvMbw==","signatures":[{"sig":"MEQCIB3QZnqFrpEFpqfOgD+q0UmznxTH8gkvLd5p6tegGGgEAiAvcgPHvhtJgET+ioys3eP3tgxtQj2IlP8y5x8QlRoNfg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":87261,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcY5JzCRA9TVsSAnZWagAAy/8P/1GTYYKnkOI4GIUQe47E\nLndkeDqQjel8CuPNb1sM1MLBQ2U2OA9vGO7UEYXAfTz1j3uNxTyJDFdrzxnr\nKyFZTsR53ECLKE0eWGYo13OjP/MetzBXp+3QGSjSRIyAFnScFdlBA+f9qviI\nMLTGVDCmwcvOeC5uWf//H6SQv16rtu7pDpP4OV+LEdCe2D4xe4iRdSNlbNUo\n3ki47t4bXDYDB5ySSoS2yKHYJzOUBucp3s7rWBNonaVexMjmiUOWcAlnakt3\nxes9mHxH7d9n3YuVRpokz9WQ9x8gHPOcpTq13zLSqAec7XPFaWqAkMWwbxt0\nTgb1X9RrG06brQhORLCqg8i2sC8FZwbgmL1LrXwFVxvpxe3BNt2i56QzhtH8\ngl+1Nf0r2EWAl7jyXABglS8Gr5p+IGuovZMvv56qvfV8o9H42/GNEI5UrGDd\noEO71z0Y3NVDk59v5vgbFYD+i2xb13ag/MompNQbc+47wd4mGnUfi/BMrf8/\n7P/lBMLtnJMOOARsT0qX0jbbS0nq0N0HfkwMv+dZNQEqIsBDkTly+6N0cLqQ\ncWZR0CFZNfhFFa2Q5G/0nX+vnQgCvf8xRUe3oJg0lm+sqIFXzIOXAZ0X+b9p\n1+8CCFJWYo0XKUFHlFLA98ZOwVK4SAYKamtOFcAUUSdM6Lk9jifYn5JCr2QY\njVza\r\n=aN0T\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"f90cebc8aea57c5e65dbd98033e11d32e19f828d","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.15.1","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.4.13","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.4.13","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","@babel/preset-env":"^7.0.0","styled-components":"4.0.3","@artsy/auto-config":"0.1.0","@babel/preset-react":"^7.0.0","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"4.0.3","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"1.4.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.0.0_1550029426749_0.25649452043690735","host":"s3://npm-registry-packages"}},"6.1.0":{"name":"@artsy/stitch","version":"6.1.0","license":"MIT","_id":"@artsy/stitch@6.1.0","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"ad928e94924d6a58dd4c1720c7f7c2cbeb703ff5","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.0.tgz","fileCount":37,"integrity":"sha512-jF2jTwgR4zSA2Datlbqwnp4hMNrF/wt6IPf5hM7M/33T3n4TsQmrHL5qDJ5np6GrKIlsTmcY3BZW0QS28d+z0Q==","signatures":[{"sig":"MEYCIQCpoZ3us8OHu5gRr3CC0yFyJkM+cHRw91vqoZiexrkP3AIhAN8RkVCmra8xYkqNkG1PHjjBb0T2dRpNLa/WVmatm23E","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":88376,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcauanCRA9TVsSAnZWagAAaOcP/3F4iAwpZGHDrfimRd3X\n9y23sGIGrCPEtTu8W8ii759bEVh+3jezC1N5z8j9smIxUuKcB4cr+BgS7vnp\nb1jX/b9YnntHxIHChGc8KmPTQK17e7VKnBW7X3/bIVFJTTSsd7Xe698cZaHB\ncT+u6Z0sqhm0VUesTg7O9npA86OnjSOxtUPAgCjpCR9I0qY6CB+u53FFBJCI\n/yUjRhykADvBKX1cU/uJFsYgO/gTtCBE50lyEZMUXWWzc8wQMWRMzvqzPhuO\n3WnXRL2PgaIlwlClIQ1cBC+Sjn8oMjLJ9MlBMCqZwZDiIbes+dgg2vs4Hy13\nsecZbFeqgoHXc4IB/w4o7T5wgWi9Q8uk2EK798mfz6TjEy2DXoNcTHni8Stz\npmu219XKCHiaNfpfYX/rLogL7mSM+0gjMw0J3XDn5Py7h2TEVsJrW+xKuyNw\nidEMt9Tr6Dl4rSEfBlDSTbTwhsSD4VBHGo0rJ28ob58rB2E+c/OJ+93kJnCh\nJSox1WOEgNvu18F5O445OL2XN0XuoF3xkAMxTxqR/qu0o/nmcg9S7n+TA1Ki\nMCAD+KfKTiiogb+uVFV+EalHNVUN50ON/B/i1GUll2K22BCvb12Q+ZsmIZ3N\n+C+EhvSVUoMfIb2pWJvYru2ThaEXivloUNLEulZATnkRHMPUBB410qhddJqC\nBiE4\r\n=CcKx\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"9bb36d1acf19dd753e6e0611106f42c5df328b1d","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.15.1","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.4.13","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.4.13","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","@babel/preset-env":"^7.0.0","styled-components":"4.0.3","@artsy/auto-config":"0.1.0","@babel/preset-react":"^7.0.0","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"4.0.3","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"1.4.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.0_1550509735062_0.9248554463214191","host":"s3://npm-registry-packages"}},"6.1.1":{"name":"@artsy/stitch","version":"6.1.1","license":"MIT","_id":"@artsy/stitch@6.1.1","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"2c56122f8445277d65293d4677fa0634dfb7bbd5","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.1.tgz","fileCount":37,"integrity":"sha512-3slVVwQcuWB99uLyTl+zM4go6f+eHazCscUKxxFUpIDjlVFNq+NOSclS2AcO0Bt+SEjgpWi67OPeN0WnEG1CKg==","signatures":[{"sig":"MEUCIBln5oQfE6i5dtRh/sDGCKSR0zmBIHjEEUi/GxUG2u8nAiEAsrAcIunlHDIb3uN33eb8BCTWrj/r8XoCXntiZdoMMl0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":89294,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcebMlCRA9TVsSAnZWagAAiGMQAJJdmdO7B3wWqbDttAvL\nDCIPCG86wsYP145YLcpLt9f+ZTxLhOr29tD3XM1PBi56XS3NHLNlITb9Rcvf\nPEfO2c1X4/22tmvTEeH+ywy/E3tCBqbEjziYol/H3sTO5esYzqzMLiET5dqE\nCptS/ipqORMWVkR18Yw5yoR+nkEboUWU2OVUQrw7YnzfxFAbcKfR6BzMM1LM\nGY8Oz54yjkf8Zx6wG/YX7dGBlsKmqzGCkGBpxtaxxn+Nkz0A6CpWKeth8MV/\neHecUKvx5HbEyL/065XyGsB+5ocZhOczpZobZsY5t0j9RwU3dPNSs3ZM/dBc\nm/1Q3c2S9BWAwsDwOm53F5nulzgsR/zub4Wo0ThpGdy1KwzYwEug5zxuRf1h\nQbeV1kByObG7BEt35fNCgrKcgOn7ZBy7xOgt+z58YigLnv8jyjPevJPObI9w\nl+kS6gd4W35abXA7m7E3jy8SVY1ICJuQwwhEjo+QqzpyPFOTtXCjzY3PYzAl\ny0ksSCcP33wPXa+Gh2eRdKf2NxpXtlq5U19ASoVqbKS+cEPl5FMxyijHWntO\niogWkH54/vPFwdCiGUJ8n6Rj/kYSTT2hwYHm3i0ZnSTtS9byfBpUyYb4h96o\nK05NFuJULCXegA+miW/GJK/tL7ozJGrsxHZE/zWjCtretK+dzTPRUDLtzukG\n2u3x\r\n=uQuI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"cf89b644a95a766e714707d957522c7599aebdde","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.15.2","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.4.13","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.4.13","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","@babel/preset-env":"^7.0.0","styled-components":"4.0.3","@artsy/auto-config":"0.1.0","@babel/preset-react":"^7.0.0","babel-plugin-lodash":"^3.3.4","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"4.0.3","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"1.4.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.1_1551479588523_0.9222180306798453","host":"s3://npm-registry-packages"}},"6.1.2":{"name":"@artsy/stitch","version":"6.1.2","license":"MIT","_id":"@artsy/stitch@6.1.2","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"a719c8b6b829780ffc17d41ee9f594b124518725","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.2.tgz","fileCount":37,"integrity":"sha512-dvscSl6kNeNiaN5TFOqMBVWZJx5+TtBHYJA2MC4UYGgUjv6gpjGZZs2Bko2ndpwPzB6eV+A0XhN7edAeMKJSWg==","signatures":[{"sig":"MEUCIQCSSaxaxqEYJEc6aBOW8m9tjHi1pJb087wBqi67REc4gwIgIdSYFni1hbz/H9cpFWYiIg/pchOagDgKYYNTUyrtvjA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":89305,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcebUrCRA9TVsSAnZWagAAD5sP/0YSlaCTp9/B5LBKCFxL\nSAu7Zqc/0P6/h63qSCYbO0l53L79p5WqtZOCM4dVmoUrLUH+6Z7p1df+p5i7\n3AoE2Vt8V3fs48oHbG/QnhTJlpVZxRmH77JMYe0ZF2KYW7+Jd/K2szpj+zqu\nFP4kJBoMG9Qh7xEVqX49Ez6U+yb8fnhNkOgiqkx2MAV2GgjyZv0rwwQPj1e4\nt1QX4PMZTYAPZyIP2GV5+uba5ljc7TltyiqFAWTySoH2ei81f67IG7bOkaue\n3Cq3YKN0PdaxCL+9yzNuNHajGW9FtpbyMVcKWg3o/+Ff29Zp2ARNTnDHyZTW\n/5JF8Q+9CuB5OIFJltxiijlVKkMjRGeDd2XtflHR+iGolFdLKcD4XAIV186J\nwjLtqVd8YrDdtjQF1LTZI3r9I0N3YlVw3V2wvEugp9auDfkJehhuvjse0qGM\nD/FAlZtSMBnl02o+erI9FoZi3XqsRxkfO5NoROOg/lJZkYAo9ePQ2Ohy3iGx\nIDvbXChmF+LBuNypCKJHTx8g/ChHYC16jOTNhah1PSRHAnD4aeN4OIFsp7OL\nxeCXO58dlF2bKvAtIf42L4zcwZGzV8BftL2eQUqQKy+DKJpna3C+2W6lR/73\nlHv18nxn11OaePIiIaFqoCPYHFAyq4HQNwPR2VfwzYJVLuXeOHSnPiTrhn4h\nd6jP\r\n=8Bev\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"bbc70c622a2384c328df76ec52c005b0cf9397df","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.15.2","dependencies":{"lodash":"^4.17.4","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.4.13","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.4.13","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","@babel/preset-env":"^7.0.0","styled-components":"4.0.3","@artsy/auto-config":"0.1.0","@babel/preset-react":"^7.0.0","babel-plugin-lodash":"^3.3.4","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"4.0.3","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"1.4.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.2_1551480106859_0.8802708976097442","host":"s3://npm-registry-packages"}},"6.1.3":{"name":"@artsy/stitch","version":"6.1.3","license":"MIT","_id":"@artsy/stitch@6.1.3","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"0d5ed6f041d87436bf63368d7bbfe39c3a586ea2","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.3.tgz","fileCount":37,"integrity":"sha512-uhqsldUqr4oAMbUlnM4TIHlDJi//HcFlj+mNhFWHLqilhPFzDC47Wu51YR8GJDVERQlNG6OD5wyXe7neAjzGdA==","signatures":[{"sig":"MEUCIQDDQ2YcN/LBf5hC5V860x+Y0miA9VjYeFooDTY2wEI0WAIgbt8vL9GZLBtlnU3yCdg+kgy0BQcTjZxNHSsLiVuA+2c=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":89368,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcebXTCRA9TVsSAnZWagAA2hMQAIz9WfWY3H6823YSD8X7\nruNcPvvTADThG4zoHxyjGMpxXSN80tswTjWPVnq64RismEoy5YFz3/Y/tA0T\nu96v2F0I/vwGjcLtRqDHpq/HAHLJWHHAP8AWv5VpDkazVkzx1HeThB/nHmFu\nYP52PA4tXJ4pfTZcEW9zN624XR1Xka2VRIu5L7PHx+D8p/07YMzhW4RAxiKE\ne5i5Ba9BnDmJMRkacMkYNlyv7j/PR0rWk4v9T+Ul9hdHhCGQE/PyHmpeOLr5\nME164vVJ8Jhy1sn92dCzuxwG+1SeeXbnlR4xc9wEtUDkA4cb5FDZMYE6vKWX\nnnYxAEh6xRFZIWVX+VMuR94iccSJyA6JbBmRoO2vkn4/sO+TeL5BSlAeHjQ1\n5j3+mHzowA1Q2JoOf4aSnHAF/Tl+NiB1qXhi9pJwex6U9YZq+R2r35FK/6CP\nKrPbxyjXJIMDq2TuxG1n1+3KksvUNwU85TYG9AQSXfOYoo0MvD2BRxieAt4I\nblMJ7niPVIwAthFKOd4jrczMihxwAeEZkfkosPvmgTS01gb+4Cws+Q1XqkAq\nODdJxelR3pYQiguL2MQybC+DZ/D4kfuQBvi4/KPx77Yc8ZsBDewmit9cJnQr\nyh4QduukMiQPN7ga+r/xrP0KLbzAd3mdi3EvOKd+4bcJBojcl6yv7KP2apaH\noy24\r\n=bWPi\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"8579a2e35e7cb52c35608cc4321dcab620a2b5fc","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.15.2","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.4.13","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.4.13","uglify-js":"^3.4.9","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","@babel/preset-env":"^7.0.0","styled-components":"4.0.3","@artsy/auto-config":"0.1.0","@babel/preset-react":"^7.0.0","babel-plugin-lodash":"^3.3.4","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"4.0.3","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"1.4.0","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.3_1551480274273_0.12574216555737294","host":"s3://npm-registry-packages"}},"6.1.4":{"name":"@artsy/stitch","version":"6.1.4","license":"MIT","_id":"@artsy/stitch@6.1.4","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"1f7cdcad22537dc2d5ab8ec50f9de0f1c5e05041","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.4.tgz","fileCount":37,"integrity":"sha512-FiLuWb4qBXFssG2REWQuOiMZUfMPMj5PFeBI61/VWsEtZeP2yOe133rvog4/ZHqZm6O6bxuSizujxIDg3zGJUg==","signatures":[{"sig":"MEUCIQCWidY1qlCeKBjjPbI8DW3O1f1V9eIlGdDs3qlsuMPjdwIgUOBuBXAxJfMvoAeOPgfVq4Kbby/NPlRporXqlrf8PqY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":90889,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc5J6dCRA9TVsSAnZWagAA5q8P/RpQ/1saWiqkdx3LejYg\n7QqbApPARdAY7iNx+cn0B4R1YwZ1F9ST/nQRqDnj6BhsvCDdX6jFDz44jKmr\n/dDTB7P9cTQbPCcpEbgIBBn+oqEkDlvCGnfM1aMkYvFva/62U30oxnBC+kMF\nXytnVDnTnoFGqVWYPV1dahCQhLvSz5V0EbenqlY/TAx6N3RAG9u0aXC7TPUp\ndxXF8tftP55MuzKU7vLaUokmjtDy/IiESXN5U2pnRWKLdyX1hdkWmh1nJNBU\nfQwFHyZwwJs0KjfTDNTbySB7j0zU+1Fh6l0RaStp2NXQMcP4sxgM0ntLjPdX\noRA39+c8yjThtom7wmfokUNwt5OjHASVvT5e0YJRiYv6HvaDPX3HlX4LyGFY\nfJGSTNCaru0+odT2rCyQuhueoEaiuoD/SBnBZNNWwLehhhjTIRZ/uO7GqEey\n5nEJToU2VlEMqF89Qw97OMFhsjkFHRAhIuidhBZOVJRlEbk4H6PxFt1C/+N9\n4R8qmTRPMLe6e5PhLfBeD0b5I4AHt6tTfSBoqVHKYDmAzGMpJRma/OC8z0fn\n6oscl+OWYyeicGuktCg5PdDsbYV0vhfx20NwFiu9iXGc7V/DAwB0zaIZWVEB\nvlxA52yxnSWIImp//nbIrbfzbJ/+hr0HeHCmluoTg8jUETvUT78bf8J3cmft\nYUPO\r\n=9otZ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"a53a81f94ee24b57a6246d1cd87373c37f53ca17","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.4.1","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.15.3","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^2.5.7","pug":"^2.0.0-rc.3","jade":"^1.11.0","jest":"^23.5.0","husky":"^0.14.3","react":"^16.4.13","enzyme":"^3.6.0","tslint":"^5.10.0","prettier":"^1.12.1","react-dom":"^16.4.13","uglify-js":"^3.4.9","@babel/cli":"^7.0.0","babel-core":"^7.0.0-bridge.0","babel-jest":"^23.0.1","handlebars":"^4.0.10","typescript":"^3.0.3","@babel/core":"^7.0.0","@types/jest":"^23.2.0","@types/node":"^10.3.0","lint-staged":"^7.2.0","@types/react":"16.4.13","concurrently":"^3.5.1","tslint-react":"^3.6.0","@types/lodash":"^4.14.116","@types/express":"^4.16.0","babel-polyfill":"^6.26.0","@types/react-dom":"^16.0.8","@babel/preset-env":"^7.0.0","styled-components":"4.0.3","@artsy/auto-config":"1.0.0","@babel/preset-react":"^7.0.0","babel-plugin-lodash":"^3.3.4","tslint-config-prettier":"^1.13.0","enzyme-adapter-react-16":"^1.5.0","@babel/preset-typescript":"^7.0.0","@types/styled-components":"4.0.3","typescript-styled-plugin":"^0.10.0","@artsy/express-reloadable":"1.4.6","@babel/plugin-proposal-class-properties":"^7.1.0"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.4_1558486684375_0.10139189010301264","host":"s3://npm-registry-packages"}},"6.1.5":{"name":"@artsy/stitch","version":"6.1.5","license":"MIT","_id":"@artsy/stitch@6.1.5","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"fd23dab1a0dd4fd36e165773fd061c0609031705","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.5.tgz","fileCount":37,"integrity":"sha512-mijUkSiEUzLmTxpdIs0uXojiRAFu9x7/cOho8tBFZqxygO9UBWQyj9bEmnBC3/qRGAHzWe1yOIQujhQFLWd7HQ==","signatures":[{"sig":"MEQCIE0sdXAbJ0E0tL86uFCrdgmsK+R4BjfrDtNkPHwTC3u8AiAfMJ4mV2suVfe/qb/xhnpowIDn1v/M5W5k+LatMvfoQQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":91997,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdnPm6CRA9TVsSAnZWagAAS9EQAJ6DdZ2EPIxIzWxuv4et\nVjS72e0WYT05nyRLM7R3dedRHRtazhH/yM1qPrMjrthbXpAIhWXyO5ZaJbw7\nsNdFs8YnTiCnygWieQK8mdUzshMLn+J1yvoy4H9Su6au67Lj/O5/GwY1yS7S\nzaqzuieuidubHyK2NLTfZtVpZ9IM4D67ibmTNSwQ64mhzhBlVi307u15lFHC\nuKvQoQVJB4UmaqEKyAKIo4iveieNFe89GsXZAgu7RHXv3CDy4g1AerFs686Q\nRR+5AXcKrEnSjy8Mod4xlVj2CloOebRohu9utmrnIoWOMv6SnsgT9DEBiaz5\no+DSWhFN2yNrl2jfA9xbrp+9O9viXWDyWR3T7aTHlizS0Y7DrtdgFTlSMR38\ngk3Ce+tCDRC4fR6yRfqPU/+xEbbWl6kowErUae4CPKR2NKbizM3x42eK0etk\n1ruvWl9i6EG7Z302p/zdhj6CX0GnVWgR47U6U/yapFqobkq+INVITbpFdsnO\nTdEG8E00k+VfnP3hWxJaTfdjDNkKr3ABXDuYvyzuz+BjfffSK5sOEgq1bU2p\nUASSfhHFqtWATIDnKFo3Gredjb/kfTQuSR3+eIMTlI7ocmGsLhAP4qnThaRv\n/QLPI9SHcAlFvm4ePf40LYcCQ5R5JFBA5qWadWvjnhnmdibYrDn7DVwGe8be\nfZbS\r\n=UPPf\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"6e12a04ab4970dd254f08c3a85cbb42ec40bac10","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.9.0","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.16.3","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.3.3333","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.1","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.7","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.5_1570568633857_0.4362804435461638","host":"s3://npm-registry-packages"}},"6.1.6":{"name":"@artsy/stitch","version":"6.1.6","license":"MIT","_id":"@artsy/stitch@6.1.6","maintainers":[{"name":"alloy","email":"eloy.de.enige@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"l2succes","email":"l2succes@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"orta","email":"orta.therox@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"f91308ac2f0910e8acc4abd056aa132eeb7a9dbd","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.6.tgz","fileCount":37,"integrity":"sha512-3BOpqvX9Lp4ufsFPYqMqWuO4DPOFYUM4xkMzRkt7emn/2DdRCwdsak0TzPISJS8g6utKPzdHlKvLaf0gS9H1eQ==","signatures":[{"sig":"MEUCIQDr0jS9bPQeKjEc6pDgI532EqxhjAyOQ3j1Nxmbdl6oxQIgCo1OMgSIj6eP5Wcq/Q8u4NUEiYi4+kf5kQqNWwUH/qc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93021,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdnc2UCRA9TVsSAnZWagAANN0QAJCfec1y374slZns6TOe\n1Maw+u2P5AH9xrdTo5EMvhOuFq6Zfts81xf+Z/cgXQb0BI81NzpHkE3x/XDc\nMq4bqxIU8Em+AOWhejrGYfi+p8nMUmNvpxyUQBfqL1gp6+YH9IfCxZ6FEu9a\nmV8fVxsQrifhjwvARzAVy2DinLaRw336JfG4EAxNQ5+DuRLWJUOyhivQXgl2\nT+oPeLENsdwchLLKqZhE8bN2qqM9QiBVPYZGh9pxR4WxcCQVhMQrwT4ZdyOA\nkGSsLQngjrZ/wQTenC8NP6kFxNy8bbvQ1M1pWEBpwDm/Z3Mud31S+lIcJKJh\nf3Mja3Q0oe8QpD9aHFrXvRlJ3zlwBhXp4ihu4SVpiX47N41EN387kXkSPFTG\nn4g1PkDRNvbZ1PopcDW0+DE+gqewrGw5m//X55EcaxXpSq3U/gGI+1bHLbfJ\nT5Ulfc9RHM+Vq4X55G6B7SHZlZYwkjIKO+CPaKOZ/zlbML8rYFpCbiZI21ix\nH60W8rBu1TyKD8w7jOeqCm4IBcKdYQESOV79QgQuhINdSS5pJcbXhIEq1C1h\nhSO7UkqPyzWsUHUpo7OArbraYVBEPQJ5DQD3wWKwtilhO2r1ZzqgSZkpyaW1\nBcy+aBpB2a7Sdb5R/PHKF5SD/Q2Vp6ViyNM0kdmOVOk1TU6HKTvg6l51jfC5\nBK+8\r\n=OUSi\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"af308a1ad5f7a8a175b4ef24cb844d3ca95191b0","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.9.0","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.16.3","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.3.3333","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.1","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.7","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.6_1570622867497_0.2691110181280201","host":"s3://npm-registry-packages"}},"6.1.7-canary.93.1266.0":{"name":"@artsy/stitch","version":"6.1.7-canary.93.1266.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.93.1266.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"4bef4b67832064d4c882dbd2be3f17dbbcd38cab","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.93.1266.0.tgz","fileCount":37,"integrity":"sha512-P1s6O3QQYZh3QaKLCSOTy0ng0sJalAeCxlQzXAt3XZ5gk2ohnt7jXAWnWovfCj4i2gTGmW7RfPcb5cnHaOiO6A==","signatures":[{"sig":"MEUCIQDmrhfbtliK3ZlUbbomE6N10/KTFlnoMJOyhXamZtORIwIgOQ4StAT+WtS+sblanxs29E8CHGxO2FhPJt1qLWcfmqY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93035,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeTKy8CRA9TVsSAnZWagAA25YQAKPWUHPf3WkdEGJm6KH+\nicU9+B0zWQD3VMMEOkB8/H8P7i/06L6Bf2jXuLJnvzsjMpmFrC/9U4E8vf+S\n8AVM2lBBOtEXHXyW80WOq1ynuETSVk9dX/HQ2NED9TK6VUeOtp+gMXpsvmLY\n7TAE2cBjIiCIKfb31gjzO0l95adv+C3vCEsxqsDAP7oddAVhQ+tFU9qlp/BS\n/vicpEajZW1RasmdziJAopj+Q85TlA+9AYDloNNxyvBGZkRbntQ7v6Eny9nf\nHCVpxXw/fALvDBAos7C4atqyJ3iuIb2SNsDh6XnneYuhxEl3SlBrzqFmF/jm\niqodYqL2Zz15t7n0IfzGfZ1VEVshKhZrT6snFTixvUGMKpOPIBcK3qA1nDrS\nqt8uNBMH7NGxOxavfXs1Y3RzWnCy9Is1fcRetnuDWucRXz0yehKTZD0lgwdt\n0z/+g3t2/wzS4IERI2RbUgslho36EoOb/Q7w5s9HfSHx+QFH4Ggdkw2maZzA\nFxslSuxPyFoXhT95PiynHGAAh7TVE9KLBcTnlcRwnABqfHS68+/d4hNE+PC3\nxfwAjFsslntdzBaD7QD/jUsck8kMCVchNNywJaQBlr0F4KWRhXuXobP5lLIx\nsSoIqqU5JEujTMzdneV+mq8HHCJM9DFUaUzNBp60aD6jSc86iu4oRxppH3I1\nC/iC\r\n=1L7C\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"ea01eda406867d07a8ef044e9f315498bfc93bba","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.13.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.19.0","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.7.5","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.7","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.93.1266.0_1582083259936_0.17760390949867877","host":"s3://npm-registry-packages"}},"6.1.7-canary.94.1278.0":{"name":"@artsy/stitch","version":"6.1.7-canary.94.1278.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.94.1278.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"eac92a0673ccc7b5020ae4c137a517215bfc7b34","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.94.1278.0.tgz","fileCount":37,"integrity":"sha512-u1CEJRhdvv16hYANErB6iQcxQfZHxYS+Wb1nIUpxln1PH+IjFFl4VEo5uA7qgCzmelbqEaZ6tmOo2LMy1b/1Qw==","signatures":[{"sig":"MEQCIH2RVlcH/8KeOjZ9BSUm2GzOaLGYsTymsNMuSeJFop/1AiBbLXklQRic+pDfNN60nteLckMtHLad91quJ1qtTlyLzA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93035,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeTxLVCRA9TVsSAnZWagAAAWcP/RZ4pXUOEPUw3PGaqxZt\ntPPw+HnyhgUZMeuVZyLCReJ/WpZZZNPe35QGl4Rge1mg1NXgWo3VfDg8cJIP\nqF7gDqPFPLs+Ze0zie1L9/2ZvHeB6TYVpONYjYCsirmTy3veTuoaWi/sg1n7\nTM5O+nOPFJ/z0TinzT8Y6mCS6v3xMUC0kNgy3amLGX8QgGZ9TtEjgPVWFnss\nB+GfScTJQmoJx7+g7iL0qzsb8onupll7fEKDw4p1SOuWmROWiKdDGSsHXK+u\ng6n1yucr9OIey4D2AW/FRZRV8o8MXGv2be9c5Ouj/KeXlpbDTpozwjtL0p4S\nNtWQoeQjXasLCJzldzZy4M4adTO9hDUbJy0bUrCsZXazUUJ0W+byBl2kbHmA\n4AHZuuTkZqyTzxgHuhbElhOgBhQ26XzQRznBrnIbQUmz30nZq/xgQYnLM57z\nBsOZXPsQSaADJMu2I/d+Kh/gehhttgJdKYRZOy0WG4qtt7/23m+OOcCLEEBu\nR5myoXee/ahrwmzap330qGxYwcV2aTUELhaDLZ7YgMkkzhjjHbP4K1nMDG+I\nwv9ZtsB7VY8y6aYeJkGVOgWYST025EyDRhrdnWJZ7Z7c4b9EfnCGnSvKxjhB\ngfFyN4Kas7khysd0OWAbEAf3Gj7V7cNLnELL6arKd1BAbNY8c7iKJuy0h6AZ\nauZ1\r\n=mnCZ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"3fdf9b68fe76fcd14ca5de9b1e28296de9c39760","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.13.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.19.0","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.2","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.7","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.94.1278.0_1582240468900_0.3593351405411105","host":"s3://npm-registry-packages"}},"6.1.7-canary.96.1302.0":{"name":"@artsy/stitch","version":"6.1.7-canary.96.1302.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.96.1302.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"97eab19b2bd27686103ab49d7f961550db22d8e4","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.96.1302.0.tgz","fileCount":37,"integrity":"sha512-GDW1ztJkTpKSjzGFKZyKQuHIoCMkopH+yTarViYGnow+XRQvnU7Xwmm5kC/PFCH/7MGKEUJ0k4sRuDlM518SBg==","signatures":[{"sig":"MEUCIBe3A055St02eqTxTAUKZs4n4IDDcz4kFhnmr8vr5yYHAiEA8zxXkfNKkLk2xiA7pI1YWIlef9NM78T50jup2wy9tDU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93035,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeWZQaCRA9TVsSAnZWagAAM+0P/Re3sdi97/8aaeh58r5X\nchD7ixEPHHOC9DqwzE83yG0ZsP5nYIQn5blUXErlKC7EI6puLJfIzxKwgWpZ\n6BsiIeRxjR+Lalge/H6slF6FvpTlyWZpBovtWPHRKdDrHDHNZxfHzghpcasL\nVfyGXRETO8d/IYi2mwGE270xZWl1xsqJTen4NYJBX7Aktu94dn+xnN2IYEJd\nkK/9WmppwtU9w75XcVyHl/NK4cjC7uDcedlMaKQuYmd0Q4DlEAUXgs1lr4bQ\nhn3+AlHkdTPUce/GiXXkmfWTvhrRQ3u4qTRtMbeWGUUbpaonhIbL3lKEsm19\nlZEpgtnpZYPVVIM5RHPSquQHYGni8xKmaeLPrYQojeambacA7QwEG91P1+el\npO88C8lHzknZmHD9YhUlnNew3fE/CckDmDoCKv9Gtm7xsR+LkQy40khnQ8Sv\ni9W/MiF1iYUVIp/k/fc4ehKy+HAcEiYP6GSubX0327gHuDPiYmZ/ZL6YriA4\nLBWCw0ENIvc+aNI+HJSJqEMx+LPsG2j1KIfnGwdrhpgq6nIw/k1Nb/bXlMtb\neUVpmSnFRlS87FpLFhPjDyAzEqaZ0PsiXdSsdFFtRt4VCjsVfYbmggNllcAX\nADUI00uM91rN57SCtIPtjW2ipErBCrAM4yUAy3GUPK8oWyrg0JtzFp+TGhfk\nBJup\r\n=5//M\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"8e528776c430deb4af218842370671a6994bf264","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.13.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.19.0","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.7","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.96.1302.0_1582928921717_0.5916166834750969","host":"s3://npm-registry-packages"}},"6.1.7-canary.97.1314.0":{"name":"@artsy/stitch","version":"6.1.7-canary.97.1314.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.97.1314.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"918bf228ad49f91c1d99a8979f30a8eb33dfe240","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.97.1314.0.tgz","fileCount":37,"integrity":"sha512-aH+yfcUCyoez40hdYqLd80LI3IJUfJCCKffBihoGiwHe1agmhLA3hC0SiWGE/XeN0TnE2PvueEIhRc3HaGHPhA==","signatures":[{"sig":"MEYCIQC8YiZsI1nHprbnZq6+nyBB8e/I66y+pNx9K1xPdw7TdAIhANfhJSGE+NUh1cY7RpgB2PlPHVRDrjv2cxBMrzQ4+WtJ","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93035,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeWbyXCRA9TVsSAnZWagAAxmwQAJlCVtM38JImIPGHd/W/\nfx0ROzIlSc490xcJztaxEP4rGPuJ+HgGkcFAiG5keLPxWUZ45tu9vxDRtj4Q\nc6+XI60lNljp6nuH4lxGE5Wp4ldz1eJcFPzOI5OM2z1lTeWTQgt5pIB4itn6\nKTjwu0DqRH8oSAjKyci8JgqWJN0LHMl0aiCI31IwaDkGBbk3kSE3rv/YyGbp\nbaCEQ6Jws/XXf/mUtD1Zjl9ioL7VjKj4I1Daq+/8ZV1V1sdG7K3IprrUy1J0\nYso2HimoS6nOSn09sPNh0GWWVodPrbOHv5KSVzc/2ZiCCkZyL4vzmlEH280D\n68CyrbCk6x4V0jFyffs9XtkhGAvuwgy4axCQXCPqqXC0xrAidYO7qkwGqjul\nY/+a1tZR9SnVj41mHTB7Ddzn93FqGYNSW8S0b6rX1Ffxoa80qVOW9x69FSbS\nlVgVYSj485NA8Lz5yoppyuV4fNmL6ZglvEHvisbt2sX2d9kKFuYkZXRDXJMR\nsq9e5kPWxBXXJKb6p03VCDy3xZr7h4Qe39ojDwAtDhlVWpD1Sl83+Y3XqZvI\nq2aZOJX9LKyrfThoLstjaDgjDomaRpl5MF/eB95Jb+beOKa5HUayJyjuiuHh\nSu3lvAjcEEBEEadNwrl7sSJc2NhBoKnUHntgdFlJasaxOdL19Z9EQLna99r0\nl1e5\r\n=VROd\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"ff2f39a58495937e0eb72056e0383aa15b3051d0","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.13.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.19.0","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.7","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.97.1314.0_1582939287257_0.48846144115228785","host":"s3://npm-registry-packages"}},"6.1.7-canary.101.1362.0":{"name":"@artsy/stitch","version":"6.1.7-canary.101.1362.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.101.1362.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"810aecf368f775548a1a27d18f626a9d96b2ffaf","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.101.1362.0.tgz","fileCount":37,"integrity":"sha512-/8vBqhKJHOyeZsRmaHfZYNVQtJ9tJ9CvYly+BSvqKTtPN/QLgoghx+KNSkSbsDnzmpAieBSJmlfCHp2YgCZG8g==","signatures":[{"sig":"MEYCIQDLWLhKcKJBlBl3UzEoXkyT43l3tne9X07MmIgT/b+4yQIhANIaaR6J1E6FGkRs/DatGeaG6A5iRhVuZF8CTMtlJSsB","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93036,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJel4dECRA9TVsSAnZWagAAUZMP/0SzNNcDOeZfrQR7h8ZD\nS72lQJa8a6bPHVMDHSAAoAAmwMrCTdj8qP8KLy9ITlkS+4hdZ6iT9/z/HP6Z\n6bBddaVhMjghBqVRR4jCbyPgx6SnFVKZyxcid6OjE8TC+tKL/guZwUI/7iL/\n0WTERhYU1SDpEoJ9kdODPEKSc8nUa9/k1GGPrWWGF2FtRb99WeCw0XB04DUU\nzRZbVOqS11RTYK3H8ZDU8D0JhmOJBSJcFhD8j34Sos/YYUGVLXRQVs2d6rZu\nhoI/OcimAzxXHLq/VH5bS/NjakV706P8YqTi2g1gx+aYfeJuBhJYh5ca8My4\nBZJMlRgTWmgE6Y+ANH7uhioqKVtr4FCg3THKj+yX3cqHJJ9HlU0iOHar7dvK\n7wRH+ww1PJkfKDTMc6x/RkMvAJr6QwJYCgkkFj7H4dx2giNLeoRD7ZIE49ZB\npdaWgFyfRzCsDtDHg7oyFpYmlQ9+abCWo72vvjz445eJOFoJyJehaslz+NzP\nPmMfS8UmE3u6cpsAfaqdi0xepoZIrg5JfSg8XMILyURRuwslF9OGg9gpxZ4h\nImInEPzwOc/JdsOma8oIkitgmBiDMNISP/P1puuDcuz2dpvZACgWx9aRXN31\nElcUOabMJ3ePiLuT5KhFbWbr+TCREaW+G9QnZO7QV22GXnOltamui3zHotLT\nU2jP\r\n=Jgy4\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"feeda27a792b3449c91c9c7ac62d3356d1dfc7c6","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.20.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.101.1362.0_1586988865724_0.11203719271009205","host":"s3://npm-registry-packages"}},"6.1.7-canary.102.1379.0":{"name":"@artsy/stitch","version":"6.1.7-canary.102.1379.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.102.1379.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"c17787b7d4f2204889caf9acbdb4b1aafa072d4b","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.102.1379.0.tgz","fileCount":37,"integrity":"sha512-xe1KZ6/29naF0sNgxohr+qPPGE/Ju7qfN4IBxR/ccWbw3nFhbuQ8vmMwHw0Op7IsRebuilRjjAV7YP1K5XGgyQ==","signatures":[{"sig":"MEUCIQCvyGOxJQYQVHlmwmnbBCJOpFTKHSPOR2mpJo8FCjUb9gIgWLJ3lqq5d8et05tTBwi5f2pzcg+guig05P5RUTp3Tic=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93036,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJes1Y/CRA9TVsSAnZWagAA0c8P/3DR/HRT5ZA33/1VfibJ\nWGKnOLLLpjyk9wgomqU4Rj2h/XslgVLAWS08koievB2UVyAVjTLb8BiLm0Fp\nfd1yWDVUUEYKTDqkWxixILjHV6C0mHQ4KnPHoOWMF8y1oWWwmUYb8hVdExWL\n3Xao1021qYrmmwqsFrPgpZNGDepiPBm3AHBxR+bfjUtIB1/yiTjGzfexazi9\nTkLqPCC8/YY1doR2INeyTb1htE1Oma7FT+OYDwFFIHUnnmdNN+bEBBgnxYij\nPTp1vAon592dZ3n+eC0bwsAtRE7zySwnIQuI9O4Y8tFr7gk9ZHNouaI3pEV1\nN7EH+cQraWeg11ZT19op2lshBK4PABLbMyxwJaXjyeR1NOjxH55gmBGH4X+n\nLk6Gx6p40Ut4i2OvE5Ih4G3vmFotCDM2LgcmTKZWCnuvmTwCoJGWLUXNb416\nK6EC7anmdG2nWpimW+ugjo1WBgp/JI7x/XHP3YhQoxF+O0BGNwlCcAt1Hhy4\nnN0ur+uNUfT9DZwml7B5568Fkmcv/Tbs+QBD4y15qCbLZW/P89jW7zt4ztfw\ne66JLrBFHU8lMdO6khZzU75G4yl7w7MnCA13df/wxn0lQ99vkutRveRNSPV3\nwAMh+TIKQIDDyn0qy0xCvrPE2XO5XwpSObFu8gNiIksX//TX5ax1pZEvCo//\nYBjR\r\n=6NJ4\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"c21eea391bdd473da6acb462ef69c760ee67e74d","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.20.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.102.1379.0_1588811326896_0.021314691621078907","host":"s3://npm-registry-packages"}},"6.1.7-canary.103.1380.0":{"name":"@artsy/stitch","version":"6.1.7-canary.103.1380.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.103.1380.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"82b10bcdbfa0c1c37aaf4095329451575b3321be","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.103.1380.0.tgz","fileCount":37,"integrity":"sha512-npOCpTYuWCd8RJ9wF/b2CxrmY2dw1UWn6Q0c7W1/Q9LkmpDz1hQZslHvMaOETYXmvsALPGgcBTeFkgeZp2cpDA==","signatures":[{"sig":"MEQCIHDR6shssPJajSKsTXfsw8HspfSrhP9pWswOXZ0Rn5WYAiBkPCd+YsCOjiRSmrc5pxwlHLMnblPTg7VpWoSInMbsYw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93036,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJes1ZOCRA9TVsSAnZWagAAIhAP/0n65Haq5YT+cELKXz34\nfR2ZmvZMMeoHn587jCRAD8rpby3Qb5yk+6/UgrCyNSUwlMrUhAjSPAKn9Ijl\nmr4np8XBF7y1QSorio9C4w29i66YlGfqPeKLNn63acPHTGj8mFFmWg7NtWeh\nAkD/EUTSryMmxPvQYk5d9Hrcr4nFmYdDalEOogeLo8oDu196peBwxY3izQje\nXOLBMwCBZ6n1FsrsBVi48dASMCmL5KLI0qaoPalgXjK/P9Gav5Ngkp5U1Okt\nktyYhqY/LJeVohkItU4DsOXd7chqswQyaf1uy9DQYeCIsQ7EQEht7Nrto6fQ\n8dvSEfbomiDSdAUNVL3yK0oL6Rhk7dfliNKn0bUysO1npvrUfstF4PssybIu\nRvBKhOOTPVUrd2dF0dcTRebmXvMiGFaeFVpq9EDpjO9aLfUl50PsD06gxLRU\nok+/gKLFK9NwFEUqyA0SdPiynNHPtmRIpj7mcgRqVES2h/vbdM28/pthuUNS\nv8dwrLxz64LgHraOCO5FrqwpT3Wniqk5wneH1J0N91nQd2r4Ys57JaKGmcyA\nLC6i4Ah2xHqQq3BgGvAwT9W4y2TIZl7S0B1p4GFA+dTflDePD994aTP5Zgf9\nD7Zsl9Y3JR7hF60p0XsjGRF1EvFcTzHOX2U+AeLRcZUTh3IeY8fLi9uZFqux\nFSdA\r\n=Fvkn\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"3b489cfa8b6ecaee596b00d704ff998ccd778d39","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.20.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.103.1380.0_1588811341829_0.3884994746163486","host":"s3://npm-registry-packages"}},"6.1.7-canary.103.1397.0":{"name":"@artsy/stitch","version":"6.1.7-canary.103.1397.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.103.1397.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"1e8ac24d412fb591114e763bb19e17cef43b350b","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.103.1397.0.tgz","fileCount":37,"integrity":"sha512-MQHhzHF8k7PV2DOvijDMojgm5jv2oU8DX+tsJrB0U9HPxYHDmD7q+qEXSfiXjGD/PfpP6bNU2wkEzx9uvhOj/w==","signatures":[{"sig":"MEUCIQCPGz3VW5O9J6HMQMbKU1WRXV+9XhQ0de26ZTEFCt9Y5gIgZPgCYRdR0jx53xvMexxknrNyCBGToA2GwOPZqpqJ3iQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93036,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJes289CRA9TVsSAnZWagAAy6MP/3aMzzWIywT+BtHqEFT8\nDKEQYryhx0HhJb7rRUvw7JuTsaMht4O7N3S9xrNq4hY5U+01vnFu+kQZHYmJ\n9pDrl1dUCGLWOUZf6IrE9fojJRDi+w9IsPGYSupwGRil/zWhLgyTJTvDt8+z\nOB99vETE21HUwS/2Ged94yhma35ATxinA4OOQDMUSOq0zAisz6FfepauT8qx\nxfBRRLqNZY+7q3N3d6jRkAow5iHXKgem3WFs5+W+W3CMC/LVSANGXmSfcVQW\n6KDM0CeOJryzOF0+EAF60GdkoWvYH8qml7vxz7Wd63NNEvwR6H+uj4fhQ1wK\n+H32JnttEmsfmn7SVcIhX1yDqvBi9v1cx/kK2Ij83gI3DieHLu+Gs9NFqZ85\nSP26l2y2qWA88esNqOWCRV8ZMSIj//Yn1UnLgM7TkbDvnRQGaA4PjP/XGtOX\n2m8ehF4Pou7gJf+h6PLTlHL4VMA913Hqk0P5KJluz3rRNFHtsVrbr4TYxaOX\npMkzuH98dRyk/fR2GjCviXx0h8/4xa8MqTsXSvorecCCq5mBZ7A2v9GAJMd2\nGWlSzuCJFp/iMV/XT3D1TVr0qi9NjuYgIh1Zrvp9muGWO/1Ax5juh1ng7QDZ\nxbLFG5Fp26F2e6b5VV4zdzdft/IrHV+FgLx4NX0jcaElNUseeSu+O/GnRVSJ\nDY9S\r\n=8t5d\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"70fbdc81be13bcc662b2a8731fe52c98e21ba92d","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.20.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.103.1397.0_1588817724556_0.9118449378438855","host":"s3://npm-registry-packages"}},"6.1.7-canary.103.1398.0":{"name":"@artsy/stitch","version":"6.1.7-canary.103.1398.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.103.1398.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"98182edf7b13ed5ac48ae762296c2c5aeddda373","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.103.1398.0.tgz","fileCount":37,"integrity":"sha512-Y0jhMwU94nrrs+ifycQ481dgx98bCJ3WrljRg4TECdsUjyUBOwzaqpjiDDsL1t1kVdw6SfLu4OojwpMTSpSq0Q==","signatures":[{"sig":"MEYCIQD9TnDBrtuz8Obi9fhXD+E0K1TOnYIqR3A62ZjqsGOIEAIhAMQ5YR0b68KW0fKyb/Dk6VpFDrSxQndzuTuxAbYR7pB9","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93036,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJes29ECRA9TVsSAnZWagAA9PAP/0xfkQJVVOMLaG5paqhv\nUkbHvYCf+z6g1gVBoxt3SD42tKqpvG/5griUj2uHQNzlfFxFgEZzIW2Nk+US\nW/+8D8Z8i8zfEJJYKT2eqqShNJOHJzwK0W4I8r4FSkZzJMX74rjH4swx++iH\nASQNe6+xMa29xvo9+9Q5Y0Rdk/nDb1iwOyIBAbkiebWzM+fYEpSi83IhxRke\nUxcmMdQQJFJ8G6jxSJBgL9QEVdCNDeqJWACpWXyQRV1SSlY5EeZ2SYRxNGjj\nwrpSpjtZoS7f7vRZnbQS4XjQSmSP5v3W1+oXK4EOx87wrwdJiNpT5y+uh1pe\nuZJE3Eyge64eQubel2ZUzuiGM3uuvRQgD2cK7xdunOJZD9aksFc75lW5q2ci\naj8qhHOnycQVtD5epwjb07ySazfCeJAiYvFQgzpeo1c4lcNecmMdiucLtgSr\n2tKJSBKcbG3OLPBofZWPwD99QM7CGBZ1ZJQtsav078yyo1FNzrcsizao7KFa\nAo04FOgCEdixNWVuAHzIqBLOkDCHl3soYROIPZ5oSP13W8SePb030to3bZQb\ndwz5vI/q0yU80aCdYc8vzi34+v4NNFjI4Z2C3PQ+Wio00naspKfbuSyEBztC\noEm1gF+ygg5Enc8B6eE6x6S5gTbnHG8NKQoM1vGZvFXtPQXZLCh3hJ855UJr\nC+t4\r\n=LErC\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"70fbdc81be13bcc662b2a8731fe52c98e21ba92d","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.20.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.103.1398.0_1588817731987_0.5397603968726425","host":"s3://npm-registry-packages"}},"6.1.7-canary.103.1409.0":{"name":"@artsy/stitch","version":"6.1.7-canary.103.1409.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.103.1409.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"e1db1f05a8ed4dc2f6e0e8b7d7c695fa70540b27","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.103.1409.0.tgz","fileCount":37,"integrity":"sha512-FO27SJ+JY+ygKnvo37R/KC9lfnnpuhslpC1L+95a+Tq2W7RpfLN6bY9YQQVvwGQH0SG390LKDFQZepdih5pRyQ==","signatures":[{"sig":"MEUCIQDFTsIYs9AbbGhQXcxnB2nUOEvJtAbnKu7lVipyiSJRLAIgWe6v0SllXNa8hg7z/dRgCgvDbuMiTfV+2gkBmAtK1Oo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93036,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJetGBDCRA9TVsSAnZWagAAtGAQAIDgfM89cbyhobhgt3IS\nL2mdSHH2NkQyoPNj7R13swc1MWzYGXv2bf0K97+qQyYURFRCYicJZCRkO7EK\nh7HKplXKX19oHuaQjtIiup91fO0iVnplbLwnaYJ2yKI1eZPUxgAoJM6+RTBz\nro/3c4hhMbZFaPlfaJSXNzyt5ZFneX/j5ujFmgY4Kh8sFR7hgaRqVYfduqQ/\ny8NRUA5X8u8piozJWT91YyeNcluCvXMatZKntmgaSLZDsb6XFTUfPOcC3h96\n+vJgioMAsE6jqfXGXXRmve/aZi7RejMqYIqR3a0w5THZSBamnWgMuwaWBwTM\nUtQWzNg+odNjC+KCiYsFM+dJUqtUBCGY6aOSTNL9H2GVB36QJGlDVwuUTqC5\nQQS4kIAwuPYndtctJKg36lYX8qUKLtSLtNtquv82BCk5E41ifd4I6vyhlQqE\n/7yZ/ArluMgva3NFsgKYrAkpJ8wkmd0J+zp8TuF4IN/bRmoqRb0kcxEgb4ii\npYHxsvZ1hk8j3OA+mciQKNv6tHIL8L6H6Cb15/Y686IQxX8mA82m6QWQQiPF\nL0HkkpLoG6EU2iAye1eDhSPrnSdZ63/KShhgBReLdBJGz7NlKnvnkw/f6cm3\n2YFOT6wSlbtrWhHyzRfpEJSMvF2mogtWjaT7hSHoLPGEsjqRr5yMVDHLk2+R\n9br1\r\n=9rYX\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"204182cfcd65373f81a72dec1a374c5906002807","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.20.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.103.1409.0_1588879426640_0.1583665832595218","host":"s3://npm-registry-packages"}},"6.1.7-canary.103.1410.0":{"name":"@artsy/stitch","version":"6.1.7-canary.103.1410.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.103.1410.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"a91a7574f60545cd390c4df69a127ea2e077e43d","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.103.1410.0.tgz","fileCount":37,"integrity":"sha512-Mq/CIh8MYZ3rE/Hz3Cspc4Omf6csIza+YkaTcekdGWtxLZD6j4NuNKF7yWhqHJXX0UURzsnqV7hLn3p+KbNCYA==","signatures":[{"sig":"MEUCIQDVE1NNBVNFm7v4D1N63r/BXJCLq044punUNyO/tODwSAIgDCEcf5V6ELqlRwg58yrUjIkjTUjtIlUuKka938FNytc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93036,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJetGBwCRA9TVsSAnZWagAA2wkP/0jU0jVFSp+oQPw35uL7\nXwnX+6NXwjSmAsJApk18B9GQ+NHFxy+2PMoriYpMD9e70f6LbW7nD3hUMZPv\nPJ73yuTl6VWXRm0RJdLn3WBPkkt7hfQY4yrlOUuxYMezF/P0WQNx+qf9DVtm\nxXG/q6q8ODZG+nXqrSMIc3rpBOVxh4vm8DtjGy+3052PAf+Tyj//ct/u01Iw\neQ6Ek4hB4w96hGZJMON7VM/FPZWwpC7fDFE0tm4M+eCdbnNTj3nR/uQVN+Ym\nLHH9/Rai8inoKCXDL4aEXQBCwJCOnkeXhESBor/LNSOAoi3IFXWn72SINsMH\n0yp2wOr/qKWxTCBUT/TPfAGClTeEa6vlOp1HbLmSOiLwfrIqFvjZZc3MqeR9\n9Nis6Z/S7+jpfVFq+ka04+pS3/RwHdgfmWYdxcbHV2cX6SvAfjoCE0JkVXp0\n24+A/a4QdyhoePeABAUuT4/CKI4P2oL0KcFo3qLvtJ+5bpW7HI1bwBnjRujj\n0dk+Kanmr18jto06n9X2TzgfgBWjzOxqmSYuAy7sLiJ+/6FHr34Wc3cDX8wS\n2FTQbLpcPaD5TI4RiFa3zbJSshyEH/GGjrR9m+99JB+XyCV96LTjhtwa8pJ9\n9tu2Z8B+p8+vXlNR4JBvyuuVfne0RMH1f9VdhB0XdgGRnPtuOCTgal8eoPIq\nclSp\r\n=tBfU\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"204182cfcd65373f81a72dec1a374c5906002807","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.20.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.103.1410.0_1588879471923_0.33687772138256733","host":"s3://npm-registry-packages"}},"6.1.7-canary.103.1427.0":{"name":"@artsy/stitch","version":"6.1.7-canary.103.1427.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.103.1427.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"c303f5aefe35365bfae8ee60bc59f01ef2c0cb7c","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.103.1427.0.tgz","fileCount":37,"integrity":"sha512-7pGcr3vo79V672XLXwuxjQp8d92XdWm5yr+WQ8JUo3izw9lJp6mLZrlWO752rZ4uM50FVhtmXtG0WXnTNhvAwA==","signatures":[{"sig":"MEQCIDs59ZvPNaDed8JoB+JBSFNDZndrZ+o5qUtwbfL6HWEwAiBSpTshDF3/lSBRiGbG6Nk21aPc/YxSw9wR60Jo6Ye1+Q==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93036,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeuvtJCRA9TVsSAnZWagAAEQYP/1RzjCn/goQ37qhg8ZD8\naJakAFQLT4pSMkyvWe4KOrNFf2yY/ToHKvo25To80pNHy6M/M1gatC7BxXnl\nwbDM6PRV8K5uJ6z6oZfgJl9dJ1wMEEpRxHq4c1eolDVft0ixKWBbFj0jRKB4\nvuv8Glf0lS7Nkgy3NVrE9YeE/labOURKxi4izZn3uCdyLV+2UhLckXyOHLhN\naQ26lyDk1JBgKF26CuERwk80ONNVGQg/z6/REp71knP+vqnPmcXZVKjMLuYC\nXBbhF6vTy25VcJOECy/vXR2NPgfniRC2bmwJYoSreSAfzx8M+rwoIuQcpwT5\nGuH67J6kJQormn/D+dy/QrStaFthUkdqJODn8EA+kuLUlwU81y3EYLAzpBJq\nImML/YyRR2D41ccNO4g3C4Vcl6L/faI+wIvzBGDZ+yoqtC29MUpfMaj9zXYY\n8xk83LdUEwwozSOCIOWrKa2vpFpfp8ptmLO2cl9Cb5yTXTw+zywDxKToOKYj\nhOpVSbAn2R8/Ah2UFbrvjLyiIbDFd6DseQjjwqkd/XkfJnEXhcvwykpJEEDP\nuob9Ey0uK86mLrgI1qk4w3x7kB3KdqhpZ55d8zubYEMCEUMDVUJruTnpAN+C\n1PfTRmw5J7XsZsfN4zSVZ/oiBvW1yi4cleXuR9wMDOT5hYV4oa2F8mA02l2H\nkTKT\r\n=D7Ii\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"7676d2d30141aeac3d3b85a578220ccd4f8e4620","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.20.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.103.1427.0_1589312328989_0.060875022961035974","host":"s3://npm-registry-packages"}},"6.1.7-canary.103.1428.0":{"name":"@artsy/stitch","version":"6.1.7-canary.103.1428.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.103.1428.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"690bc7d0965d4eb172dd4dc5c4699a8661a2b2bf","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.103.1428.0.tgz","fileCount":37,"integrity":"sha512-cqcxgCqNGYYObxRQbaXWsI7v2yuRCTExKRDg4GAox9HwU8vGQex+/CeXvBfaxDB33uGY+QAs33NR0qin+cTkjQ==","signatures":[{"sig":"MEYCIQCj8IQh6JIjMo876GpY9G5DXiIJFAtWG3QNACPg8aTxYAIhAOwO58CIF7/pRULM140+M1w9tTXg+3DzlAsx+WTQRcMY","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93036,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeuvvECRA9TVsSAnZWagAAkfcQAKKZwhL8VoCSWSbUGxsK\nTWN/ply6F9zM5T0xaszbRV3QkkCTGXuWnvVmFbNjxhK5nqv5hGA0X4bFkUnE\n2iHpsKoVN8scxRoD7Nqy54mwuxr+H/eDUaZkRwDuO37mUX7UqHTKTabVg/tW\n1hxaGw78JvtELol0B05DQLVm+cYBGbR4CM8UUmXgjSlQTVXpsbOv4NgI28F+\nYqq5a/rK5Iwxd60GvuKJdJ3Ebso2PyKefXcWVK4y2YeqAW+9AIF08309FF8t\nl5nAj/Sv2mze5KSejJMAKoh33O9T3kubIGbCOn8+gGcrVhSudhkibSoKXpSz\nOacZPZoLDbWxswo+pYBQZ3J+yLjvyQMvUSf8Y2yzAW6i12FBMl+K49mGTlCK\nlIYZyO3dmHrFFgmt4JMsKmT1Slhkf1ge4ChYrF6dWkNV26D0ZNEsgfo8xknX\nXwlhbCqthWxquSIUwCgsPdQc0CapBQ2WbmnyubUQnlf2B0Jf3FjFw3aX5bi/\n8EgBO6azMwk8nG/KO11uWtAXnhGBK1JGhPvcooWWi9IMElTrVaSGcvGtRRTR\nR6Q05K9lGnqHot3TIeidpsOlCBeS0ct27qEMbnnaxqj/Uz0sF6K5py3c3gFl\noRro4ukM/WKkepPVZoKjVKy4x6vBzvWP0+j8t32+L/y/xDd7E2y9kzwTuU3V\n9fax\r\n=riUb\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"7676d2d30141aeac3d3b85a578220ccd4f8e4620","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.20.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.103.1428.0_1589312451884_0.8849718692320756","host":"s3://npm-registry-packages"}},"6.1.7-canary.103.1451.0":{"name":"@artsy/stitch","version":"6.1.7-canary.103.1451.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.103.1451.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"661e1031a75daf65f41bb34cd04bcbf7f2fda2a1","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.103.1451.0.tgz","fileCount":37,"integrity":"sha512-bzVxFLAfNQ8A0KsmzWFI7S7+uTgCtdlpObw8xt52HPB8PeFPNn1BuqQFCew9EoKfjDIUat/lwDI+x+B9iUpXVA==","signatures":[{"sig":"MEUCIGkVdQC7hiw/DqzNXQ6qYU6BarMWNa0yxun9z0jX6P1+AiEA49x9KINs9wxYDncLahzEdiRtI8CB0UWgcKcM7tABUfk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93036,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeuwkhCRA9TVsSAnZWagAA8ngP/3TcXq59wLE2PjshYsOS\nIIG689T5z8YnJjJOJEobPtK4T8+Uj9fdoagsEPCP/iN6he5N5HziFIbAqTiT\nyUgukl/cVdAhGMhYUHH2movFL9AyKUq2M755SW3qRORgXwGVo8L5wYyNUsxP\nqB60cAofhpkWfYlce9Tzz77lLzU907t6sj9u3sgy0xcOmWZ9bmj1MR0aVrlt\n0xx/T6B3k/xLbON+R245UTd0+nJLttwJH0dQetEo33XDGbSvVSUODtQFyTC+\nATgFYUu0UNY04VWWAeSgVhcV8UultRlwh7NkbSarveO5Hr8diTx22IM6YzGj\nDLwUQWqX40jevWBQkP1MD4br+nR8r2voKwdeSsGoUmfK1nG/OquTgs+JzWZ1\nmbH8N9jhHb6WuGtkQm/CYG21XZ+cMJddpD/V6Po7jlgSo7mbTpOuQqVK6+bZ\nwkYpb+flhRM624H4hUPU9BCXjyD2wYFr88rkwsuJ9wy8G/xD7SAGPW0O4v0y\ncHnKMNHfrGbMD5C1Yzj2RvKPPhpsyyYQOYEw0lwOQ9loJadmwCPSwCRqli1o\n9XA0YYOCM9BoPpcd+Os/xR7R1kMZfIL6gppui4lRGbYA/KJWTx9oB7Uh+WOM\neUND8mcthYCN5QS+S/l47YnJ0pppMaTTBbH+LFYB85Ltb+fBq1NGM0d07ZsN\nXFRM\r\n=w5hZ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"bed89bb2b84869feeeffcebe113ecdab6156a097","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.20.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.103.1451.0_1589315873101_0.41387265462831757","host":"s3://npm-registry-packages"}},"6.1.7-canary.103.1452.0":{"name":"@artsy/stitch","version":"6.1.7-canary.103.1452.0","license":"MIT","_id":"@artsy/stitch@6.1.7-canary.103.1452.0","maintainers":[{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"eb3d6460dbcb434eb03528d4ac14535c58b82d4f","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.1.7-canary.103.1452.0.tgz","fileCount":37,"integrity":"sha512-HHMh/zW+wY7kcpaDYnK3NBWPkMQUgvpD+Jp2ohNBMBUrMKnZZa/wVXIBL6LD8cn+RpE97PnIByG983JSkdfwcw==","signatures":[{"sig":"MEUCIQC0arWyx09Y+dNckDoMStHZPUYNrrlrm5yd5lVgn95EkgIgDyTSU5YKBTd3iYkM0P2XsqdSDOA43+LJJ3jRfVNfoXw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":93036,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeuwlQCRA9TVsSAnZWagAAzwkP/3XeqAtfJOJ2h7gJEuaz\naN86l+55oQw0dHBjjVxx0Nj0b4qnaD2yhtRHUvFQAaKA7G4obHh1eoX9miUO\nGDQziNhl0N8ANG0wj8uMW2EY169ZwRK0CAdCjQk1heuxPlBDCjgvekFdJj+g\nXZfZ8PRHU0IqHkwrj5Zum56+SOA7tSvfW+FnReZNARrLmW8ILYYw58rymLkl\n5tsoMCQTOipDyW08GgaZiLoByl0k5gxAy06y9i2/4gRmoZjOxrIUpKkHhnok\nq4cESwOHeeINKZhPPeFVkEooH79HFpznYmxekmkXSjY5hZSZomzPJlWE3b2W\nwEDAqXqi414+z7PMEV1bDMSZKaZuZvXNGurKQdjfLIL5n7tuYyxrNjX8g5xl\nLhrC+5Dtf0l6qh4ozk9XHqDrF0w4gVgoBZICv0bYciUFLLHKmGqUrkLurxgH\n2OQ5/anQ+aob6nbSvIiKo88XdIsDutuSqBK0JLH/xSNYYXofOwNARLkkl9BU\nnoADZPeO1moMG04Ue10BHFdDBFyG2GTJNzbfLZmfUUnp51IFR7tRs7kGQOrZ\nXJ/UIeLoa4/TTGWfwnjschi+GyAbXrHx0HZpH1H7XasFxM7JfN236AP41qQP\nsCYjX5Bpvo4wWIJYwxcQBkaqfylC6t21lLYhNrWVjFOL/7qAXlz4cbLEHBkK\nCEEi\r\n=5UMf\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=master)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/master/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"bed89bb2b84869feeeffcebe113ecdab6156a097","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.4","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.20.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"3.8.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.1.7-canary.103.1452.0_1589315919976_0.8234001259338719","host":"s3://npm-registry-packages"}},"6.2.0":{"name":"@artsy/stitch","version":"6.2.0","license":"MIT","_id":"@artsy/stitch@6.2.0","maintainers":[{"name":"icirellik","email":"icirellik@gmail.com"},{"name":"dblandin","email":"dblandin@gmail.com"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"zephraph","email":"zephraph@gmail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"eessex","email":"eve@artsymail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"125ec81aca8ef7ea3e88347aa877445b44abbb20","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.2.0.tgz","fileCount":37,"integrity":"sha512-X9G+crRFE8x8deYWu91YHrujoao5i7LWfANzX5699s29BxOhTMTzosIOlSrYVFVu5C10g8AkT+sbr7skZJaZIw==","signatures":[{"sig":"MEYCIQCta9RcO2aOR+Gu+soy4uQUneQqju0dnTbx9iN5/w9atwIhAIKHvR8yW5RmejMAss5d0+3tQ/VnfAY67MI7Ux8Gp/Iw","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":97556,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfnHcACRA9TVsSAnZWagAA9ygP/1din+h3Pv1mGjdZZd9e\n8vBCNiRyeJQy3O2bA84FuzIVxXSlIIMmujBYrgNy+XfDoEQTLFi+kJoIRUjf\nQmY/DtDDFq7RZy/XXwqsUxcmLoe3rY/cnHcwBiSr1qy6Ei0QuHkkcUFwoWVp\na+yLuzieR/dHgH5TLGrpMWPWwHE7oZzjj2f77Q4mNiUZvILgB1ooAvraVP2L\nrYtyaO3HiteaIf3Ju4016xgstt7WQVoH6opmMLGzQdBS2pj/SNnjF+Poo+2s\nV1szrvCDf5CK33Q151SHBDUrwrkN3qYToR/3YMeFY5Uhxwl92dRWe2qtJB9M\naXC0qL7iu7kQBGlgNpK0yT9IbPhNJ+CGUDGCZTvkTX2XuMpwDTIN9+Evyj+Q\ncDdQFheELIKNqdxH7gpi/T4jfsEg5+hjcIExnNGEPCxF1QZUKS2j6EJvtXyd\nZEfxSQ7M6824yjPfB0rdxlJcv1DC5RGXqpiTCfbJLu4SN6X29KZxu+wXtoUh\nYBCKQhnB4hwkpgth9Q0HsdC5iVXKA35XV6QN813u+uCRDblCUH63JYGpwP7M\nENPAoHegPsTQDb9Pzeplw1B9p9fGPr9s4SSKTK96wxFZ/96QQ/zI6bkfKc1m\ndyKL/kMky22OPcHicf2tHK6W/Hj4oqWInnNKQP5ASpWtHg/m/j6iP/U4X3Kn\nhkqU\r\n=9KHO\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"f9501e497972e595dda14ac941918163c50e81fd","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.8","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.23.0","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"4.0.5","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.2.0_1604089599821_0.783046794091409","host":"s3://npm-registry-packages"}},"6.3.0":{"name":"@artsy/stitch","version":"6.3.0","license":"MIT","_id":"@artsy/stitch@6.3.0","maintainers":[{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"zephraph","email":"npm@just-be.dev"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"dblandin","email":"dblandin@gmail.com"},{"name":"icirellik","email":"icirellik@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"3f62ec67e75f276b57121d3c7014d4f4bfd796a4","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.3.0.tgz","fileCount":37,"integrity":"sha512-/KZxtauhVyh5gBGJOrdP6vWkW4kZG2cNgt6VFeG4HAU5iKvMK8bfzXEfOvCuRWoXzuiUOhuMj4rB1CGVMbUpQA==","signatures":[{"sig":"MEUCIETOLi4jO/244JP9sD8+LuOKetEpwO0TKgm0JZcP721eAiEA6aRqlAvKHL6+lrSS3IZFOF7IH6F5WWaPQbZsvFn4IzE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":99649,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg0kVUCRA9TVsSAnZWagAAhyIP/A6wCU6LmMAEpjrTw8Pf\niA3I3L5INv+o5prPozcdvs5j0fU2zNo52zHOrUNNbYWo8kuSr9kEaCITuMJH\niUNy4lZHUzrOSNUt4b9Llzfem8WDpx25ncvfuDeGm0uc3BEPc/jYK4i+oyfW\nZqwCxdcrUPlgV6L7s4q/v16VVa3cNZ8pP0dfgrQf1P1mYC7Y+R106AhNcPQF\npiX9hZSpCOr7J1HLTPdYwgSwFNu+EuWGa6EB0LodEkuYKWwoipvTTiFH5xVD\n22cvTgUN/Ux7pnnGowIRbyCNQQTBhodrA6ZGKEwgNThtrr4hui5FmrmgZAH2\nA9HBGzO2CmRQ8ljET582suU5OhXqlpr94PNgOcb+syJtSFMmvj+Ahfe6WR+Q\n2P0t5kGf+HQNzzCNFWJS5H4Kqn9Crht0rCiZeAEQ5OQ7OP8pAYJdQ8gi1oLK\nCm9W+kt03fUs72syytnCi/JGvmHpMWXdrC4dTPnaE4Dfvzpb7QsOk2FmhneK\n19UobgGrzFp/40GPiQkW3yoN4RAz0IAdKS875+7AikbLrHlqlfq0R/oo/gKB\nD6AZBAdfAL+g4Uxca05a8Ebt5zcVDavBZAJmU5r624+IM0xcu73bIBJ/f6Ex\n2an4Ah2nlIUQ15QaPy9cSU6l1ZGAzS3sX3oPzeB28miNnhjF/wQ9cIzp6mef\nOJBq\r\n=EHCL\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"9f9acaa45c524aeeb13d98107a14a3eaa0caaeba","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.12","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"10.24.1","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"4.3.4","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.4.8","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.3.0_1624393043781_0.40809938124954903","host":"s3://npm-registry-packages"}},"6.4.0":{"name":"@artsy/stitch","version":"6.4.0","license":"MIT","_id":"@artsy/stitch@6.4.0","maintainers":[{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"zephraph","email":"npm@just-be.dev"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"dblandin","email":"dblandin@gmail.com"},{"name":"icirellik","email":"icirellik@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"10e6072dc51a7b23d9c59b113d58408df894be26","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.4.0.tgz","fileCount":37,"integrity":"sha512-0IYbFj6qtCuIzVxukJUiHEywGWCi8j8XHkzrUGs35mCH1ZK5lKyWU1XXSyKx5lU0U1mNGzSznwJLrGUyToLpNQ==","signatures":[{"sig":"MEUCIQDjhwBN6Plv5zYY0Rt5iJeQFTVkFG7rNWL0EN0Pw3f+NQIgMFjmchWHW2pqKr9FxG6xsnYEw8eNi2N/Mpj+d/wJaa4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":100983},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"4c54eb48c85c07947db406f1a3a70c905ffe069d","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.15","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"12.22.6","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"2.6.1","pug":"2.0.3","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"4.4.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.0.2","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.5.0","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.4.0_1632169471317_0.793335026357805","host":"s3://npm-registry-packages"}},"6.4.1":{"name":"@artsy/stitch","version":"6.4.1","license":"MIT","_id":"@artsy/stitch@6.4.1","maintainers":[{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"zephraph","email":"npm@just-be.dev"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"dblandin","email":"dblandin@gmail.com"},{"name":"icirellik","email":"icirellik@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"c0391e2dc809da3ff96719ec6ccb026755f03155","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.4.1.tgz","fileCount":37,"integrity":"sha512-/0Dv1BivTnyPPes7XiNxm3tl3Z7S1KO+n2QaSqTXyS+KaAYXDy8Suv+SP7Acfd2E9F0pooHqyNfr02h5E+P5UA==","signatures":[{"sig":"MEYCIQCT7OB+ZsUpxsABB62Gkd9onHvZWbOcA0nzddHXuj0S7AIhALF9vRg7DTs7eoIXMdDyKp2eMjX7gDGaOavp5xZkhZUY","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":116430},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"34f534abcf99aec4699eb4780d7b207c22d6a0e6","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.15","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"12.22.7","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"2.6.1","pug":"3.0.1","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.1.0","typescript":"4.4.4","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.1.0","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.6.0","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.4.1_1634667590288_0.8022358170375521","host":"s3://npm-registry-packages"}},"6.4.2":{"name":"@artsy/stitch","version":"6.4.2","license":"MIT","_id":"@artsy/stitch@6.4.2","maintainers":[{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"zephraph","email":"npm@just-be.dev"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"dblandin","email":"dblandin@gmail.com"},{"name":"icirellik","email":"icirellik@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"06823ed7d6644fbff95648ad09146a8b0ba3d9e7","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.4.2.tgz","fileCount":37,"integrity":"sha512-h7zO1A+R4wB7SEIWIkT+1Lw+yWLXNLiW9GYXxfxJihg8zg2IGLZHAjry0HOhAzXMcwLvenvOATVKcjTB+OHJJw==","signatures":[{"sig":"MEUCIQDKJlkfDPN9f28uARlgzJ++eC8oNimcjYf2WR6hYz+qDgIgc4G4Y+Z7d+OhepH/uL0vBlUFbeSD0wcyw2jqpB8j++0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":117510,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhs7q/CRA9TVsSAnZWagAA13gP/3d2rsEnX80Lhlg0qNPA\nmbawpUHfP8fQs6aB2rrBob15F2blmma7oI312pqDYrGYEqIUPa3CNfuIiBac\nfWCHUB4iW2zSQ6Uvqh391je8q5ROPc/MF/sz5Lu8jgaowxQu2CbVwGSGE80T\niYi0kw9wEhTlTN+obp0JR2lGsQMBBnspOEQ8ab3aE5fkAKtl/L2iq0O2Ce4V\nG5HqwLnXMIS/Jaycp+Q4IQRbQJVv+rmDjBrP2ZWwYZIBOqQ+HWVjrMog7Iqi\nz4MuvdtuvbuFIUf6mjYJqREKQu+UyQKmjqthNg9r2KFWiDXQGq+qBY2TspE0\nf4joGuiDtIeFu9uDGklLHW73ZRIf3vMQQdFahjPXrSGltzbw3H23baJWFjZd\nd/XlIkx6KuZnpIi/KXKlOSogQU2fzPG57vP+bOdygryCTav5+wDhnpnPihKP\nV3eoiVcwm+HjVM3//cSRG4AoD+9QgcefbbLBUD3UIsupAc5oHlVXLjMX8aeI\n5sB/gdqj7Q1GnA/90Vww7PjEMJcv7ahR3EgPgk3pJ1sF2ny/v0+8Z2EWO8uZ\nk4NShjN8ItoAekOzORr5nb5YWU+i+Oay1fJJtxD66YVUde7bdedjJR+4fWiR\nxxbOWiZxfqCKgRrtliTRGMimM4w/psNpt4D1fYX7k2dQ83x5lhegsXrleOTW\nfZeb\r\n=fSuR\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"d453caa28e8c6a6bf301ed2f937c6b62c58b4e2f","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.15","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"12.22.7","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"2.6.1","pug":"3.0.1","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.7.7","typescript":"4.5.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.1.0","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.6.0","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.4.2_1639168703319_0.013237539563193401","host":"s3://npm-registry-packages"}},"6.5.0":{"name":"@artsy/stitch","version":"6.5.0","license":"MIT","_id":"@artsy/stitch@6.5.0","maintainers":[{"name":"artsy-engineering","email":"opensource@artsymail.com"},{"name":"erikdstock","email":"erik.d.stock@gmail.com"},{"name":"xtina-starr","email":"c.thompsonms@gmail.com"},{"name":"damassi","email":"damassi.pappas@gmail.com"},{"name":"anandaroop","email":"anandaroop.roy+npm@gmail.com"},{"name":"yuki24","email":"yk.nishijima@gmail.com"},{"name":"mzikherman","email":"mzikherman@gmail.com"},{"name":"oxaudo","email":"oxaudo@yahoo.com"},{"name":"eessex","email":"eve@artsymail.com"},{"name":"arjelks","email":"ashley.jelks@artsymail.com"},{"name":"zephraph","email":"npm@just-be.dev"},{"name":"sweir27","email":"sweir27@gmail.com"},{"name":"dblandin","email":"dblandin@gmail.com"},{"name":"icirellik","email":"icirellik@gmail.com"}],"homepage":"https://github.com/artsy/stitch#readme","bugs":{"url":"https://github.com/artsy/stitch/issues"},"dist":{"shasum":"2467e967dc6c033656e1471f8220199130db890f","tarball":"https://registry.npmjs.org/@artsy/stitch/-/stitch-6.5.0.tgz","fileCount":37,"integrity":"sha512-RSfQITW79wT/NwpvCdkXYmXqGYzTXJiSOza8L3y5bKwg6hZfC3SlfRoMmQAHacWrjIMEY8FTlLb/2TvsZmsfEQ==","signatures":[{"sig":"MEUCIQCTP2VHQtm0Hgu2imG/xpdgYQE5HiDQ9FJ8aFuhjaOWDgIgARRCaeb5IBD/vC7deKjR5WosBXQMey4UcAGwORX+JPY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":118980,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiVtWOACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrbFg/+IelspWPIOwCDZH7vTGFRC0W+JCqriXgmKDca9okrNtrmKrHZ\r\nLiAZxGj/siIqRsMDG5pbVGQwA9sKQvPjOnzBk2pIlVZzdvy8leB4SeuyF37t\r\nKiAgqGy1SnGCUri5dtfUE7pGC/ep3JorFT4ZG0F7yMpdjx6CgguPa9Nkx4zv\r\nAIBwUPfny7Y89W+eCbgLEcxDAITCZNOcW2ih0cLh1J5a1gUm/wWcAWebxP0m\r\nf5aLlpn+0Y4KcPaaP1uIk/Vxl/7a1y208Zl5eAwWcFXM/iBsdLEa9E6V+0eJ\r\nblvnaLqMtGKVClNo31ddg4MBx/8H8ax+ptMXo0eZm/RbCObUna8UAdKttxE+\r\n0A4pxRMuMvXRxOEVmioDG988QB8Clq1JOwwb1Cff+RNkhNROB1y9LXy8RGBe\r\ndQZkbwMrj5GquUzJ48GFIJ8Uj9epjgf8bjAdfhXk7igWeK0O1I+i9PmMIB4l\r\nF3Npj2aS9kvEQHFdUgRUBUpGfTMPJQXO1JojGlkf0S8qNQB5d66B/mtdBizV\r\nJv3EesML4rl08W9bPYdfvDqRf3Vevll2PkllzrqRB513tCICd+lIq+qFraXM\r\n6iNniXlyoeYeyTn44Q4L81VMm6boQ6ggT8f86FGooiWTOwKmvu869JY4fq4/\r\nnUnibH9EJfCzmekHEZi8/LoLv42F+734FjY=\r\n=/TpB\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testRegex":"(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js|jsx)$","transform":{".(ts|tsx)":"babel-jest"},"setupFiles":["/jest.config.ts"],"moduleDirectories":["node_modules","/src"],"moduleFileExtensions":["ts","tsx","js","json"],"testPathIgnorePatterns":["/dist/"],"modulePathIgnorePatterns":["/dist/*"]},"main":"./dist/index.js","authors":["Christopher Pappas ","Alan Johnson ","Artsy "],"gitHead":"5db1527a967cdcca2d9dd14aac340630a0451e40","scripts":{"lint":"tslint -c tslint.json --project tsconfig.json","test":"yarn type-check && yarn jest","clean":"rm -rf dist","watch":"concurrently --raw --kill-others 'yarn compile -w' 'tsc --emitDeclarationOnly -w'","compile":"babel src --out-dir dist -s --source-map --extensions '.ts,.tsx' --ignore src/**/__tests__,src/**/__stories__","prepush":"yarn run type-check","release":"auto shipit","prettier":"prettier","precommit":"lint-staged","type-check":"tsc --noEmit --pretty","prepublishOnly":"yarn clean && yarn compile && yarn type-declarations","prettier-write":"yarn prettier --write","prettier-project":"yarn prettier-write 'src/**/*.{ts,tsx}'","type-declarations":"tsc --emitDeclarationOnly"},"typings":"dist/index.d.ts","_npmUser":{"name":"artsy-engineering","email":"opensource@artsymail.com"},"prettier":{"semi":false,"singleQuote":false,"trailingComma":"es5","bracketSpacing":true},"repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"_npmVersion":"6.14.15","description":"Helps your Component and Template dependencies peacefully coexist","directories":{},"lint-staged":{"*.@(ts|tsx)":["yarn lint --fix","yarn prettier-write --","git add"]},"_nodeVersion":"12.22.7","dependencies":{"lodash":"^4.17.11","consolidate":"^0.14.5"},"publishConfig":{"registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"2.6.1","pug":"3.0.1","jade":"1.11.0","jest":"23.6.0","husky":"0.14.3","react":"16.8.3","enzyme":"3.9.0","tslint":"5.13.1","prettier":"1.16.4","react-dom":"16.8.3","uglify-js":"3.4.9","@babel/cli":"7.2.3","babel-core":"7.0.0-bridge.0","babel-jest":"23.6.0","handlebars":"4.7.7","typescript":"4.6.3","@babel/core":"7.3.4","@types/jest":"23.3.14","@types/node":"10.12.27","lint-staged":"7.3.0","@types/react":"16.4.13","concurrently":"3.6.1","tslint-react":"3.6.0","@types/lodash":"4.14.121","@types/express":"4.16.1","babel-polyfill":"6.26.0","@types/react-dom":"16.0.8","@babel/preset-env":"7.3.4","styled-components":"4.0.3","@artsy/auto-config":"1.1.0","@babel/preset-react":"7.0.0","babel-plugin-lodash":"3.3.4","tslint-config-prettier":"1.18.0","enzyme-adapter-react-16":"1.10.0","@babel/preset-typescript":"7.3.3","@types/styled-components":"4.0.3","typescript-styled-plugin":"0.10.0","@artsy/express-reloadable":"1.6.0","@babel/plugin-proposal-class-properties":"7.3.4"},"peerDependencies":{"react":"^16.5.0","react-dom":"^16.5.0","styled-components":"4.0.3"},"_npmOperationalInternal":{"tmp":"tmp/stitch_6.5.0_1649857934017_0.32775119516180284","host":"s3://npm-registry-packages"}}},"time":{"created":"2017-08-26T00:28:21.055Z","modified":"2025-11-18T23:32:00.651Z","1.0.0":"2017-08-26T00:28:21.055Z","1.0.1":"2017-08-26T00:33:56.977Z","1.0.2":"2017-08-26T00:43:54.728Z","1.0.3":"2017-08-26T01:19:50.327Z","1.0.4":"2017-08-26T01:25:18.292Z","1.0.5":"2017-08-26T01:38:41.782Z","1.0.6":"2017-08-26T02:09:52.339Z","1.0.7":"2017-08-26T19:25:23.365Z","1.1.0":"2017-08-27T07:25:29.146Z","1.2.0":"2017-10-20T04:41:12.842Z","1.2.1":"2017-10-20T04:44:22.729Z","1.2.2":"2017-11-04T18:41:44.095Z","1.2.3":"2017-11-04T18:43:24.948Z","1.3.0":"2017-12-21T01:37:59.517Z","1.3.1":"2017-12-21T05:30:33.801Z","1.4.0":"2018-02-23T02:31:24.206Z","1.5.0":"2018-04-24T22:49:38.642Z","1.5.1":"2018-04-26T18:11:02.313Z","1.5.2":"2018-05-04T20:57:38.901Z","1.6.0":"2018-05-04T23:39:28.486Z","1.6.1":"2018-10-01T22:40:32.969Z","2.0.0":"2018-10-01T23:02:43.071Z","3.0.0":"2018-10-03T01:35:37.708Z","3.1.0":"2018-11-22T06:02:37.376Z","3.1.1":"2019-01-06T06:54:22.968Z","3.1.2":"2019-01-08T07:26:40.021Z","4.0.0":"2019-01-09T02:05:47.373Z","4.0.1":"2019-01-12T00:32:56.586Z","5.0.0":"2019-02-13T00:00:37.270Z","6.0.0":"2019-02-13T03:43:46.954Z","6.1.0":"2019-02-18T17:08:55.214Z","6.1.1":"2019-03-01T22:33:08.677Z","6.1.2":"2019-03-01T22:41:46.988Z","6.1.3":"2019-03-01T22:44:34.395Z","6.1.4":"2019-05-22T00:58:04.480Z","6.1.5":"2019-10-08T21:03:54.006Z","6.1.6":"2019-10-09T12:07:47.715Z","6.1.7-canary.93.1266.0":"2020-02-19T03:34:20.083Z","6.1.7-canary.94.1278.0":"2020-02-20T23:14:29.047Z","6.1.7-canary.96.1302.0":"2020-02-28T22:28:41.845Z","6.1.7-canary.97.1314.0":"2020-02-29T01:21:27.422Z","6.1.7-canary.101.1362.0":"2020-04-15T22:14:25.960Z","6.1.7-canary.102.1379.0":"2020-05-07T00:28:47.090Z","6.1.7-canary.103.1380.0":"2020-05-07T00:29:01.948Z","6.1.7-canary.103.1397.0":"2020-05-07T02:15:24.676Z","6.1.7-canary.103.1398.0":"2020-05-07T02:15:32.177Z","6.1.7-canary.103.1409.0":"2020-05-07T19:23:46.763Z","6.1.7-canary.103.1410.0":"2020-05-07T19:24:32.109Z","6.1.7-canary.103.1427.0":"2020-05-12T19:38:49.108Z","6.1.7-canary.103.1428.0":"2020-05-12T19:40:52.000Z","6.1.7-canary.103.1451.0":"2020-05-12T20:37:53.213Z","6.1.7-canary.103.1452.0":"2020-05-12T20:38:40.167Z","6.2.0":"2020-10-30T20:26:40.000Z","6.3.0":"2021-06-22T20:17:23.901Z","6.4.0":"2021-09-20T20:24:31.461Z","6.4.1":"2021-10-19T18:19:50.436Z","6.4.2":"2021-12-10T20:38:23.917Z","6.5.0":"2022-04-13T13:52:14.561Z"},"bugs":{"url":"https://github.com/artsy/stitch/issues"},"license":"MIT","homepage":"https://github.com/artsy/stitch#readme","repository":{"url":"git+ssh://git@github.com/artsy/stitch.git","type":"git"},"description":"Helps your Component and Template dependencies peacefully coexist","maintainers":[{"email":"opensource@artsymail.com","name":"artsy-engineering"},{"email":"anandaroop.roy+npm@gmail.com","name":"anandaroop"},{"email":"mzikherman@gmail.com","name":"mzikherman"},{"email":"dblandin@gmail.com","name":"dblandin"},{"email":"joey@artsymail.com","name":"joeyaghion"}],"readme":"# @artsy/stitch\n\n[![Build Status](https://travis-ci.com/artsy/stitch.svg?token=gy99gfdxXxqG3ydmn6xq&branch=main)](https://travis-ci.com/artsy/stitch)\n\nHelps your Component and Template dependencies peacefully coexist\n\n### Overview\n\nAt Artsy we have a number of Node.js applications that have been in production for a while. [Force](https://github.com/artsy/force), for example, was built when CoffeeScript and Jade made a lot of sense; CoffeeScript fixed many of the problems with JavaScript pre-ES6, and Jade made working with HTML much more elegant. As time progressed and new technologies became a thing these solutions starting feeling more burdensome to continue building features with and many of our developers longed to start using next-generation tools like React.js. But how? Short of a rebuild, which resource constraints often prohibit, merging old and new tech can be difficult, particularly on the view layer.\n\nThis library is an attempt to help those making incremental transitions away from templating solutions like Jade, EJS and [numerous others](https://github.com/tj/consolidate.js), towards React (or other [React-like libs](https://github.com/developit/preact)). What it does is provide a flexible set of conventions for dealing with layout code typically seen in Express, but will work just about anywhere that raw HTML is sent down the wire to the client.\n\nIf you're using a templating library supported by [consolidate.js](https://github.com/visionmedia/consolidate.js), this library could be useful to you.\n\n### Installation\n\n```sh\nyarn install @artsy/stitch\n```\n\n### Example Scenarios / Who This Library is Aimed At\n\n- Your UI is built in Jade/Pug or other layout based-engines, and you use \"block\" functionality. How to inject React components into each while maintaining backwards compatibility?\n- Alternatively, you use a templating library that relies on server-side includes. How to do the same?\n- The bulk of your app is built in Backbone, with each view backed by a Handlebars template. You'd still like to use your existing views / UI while incrementally migrating sections towards React. How to \"render\" each Backbone view inside of your React components -- or vice versa?\n- You've got a server-side-rendered, EJS-based app and you'd like to start taking advantage of React's isomorphic \"universal\" rendering. How to go about rendering React components on the server and then rehydrating them on the client?\n- You've got a new app built entirely in React but for one reason or another need to keep portions of the layout isolated from one another.\n- ...\n\nOut of the box, Stitch aims for flexibility.\n\n## Usage\n\n**Table of Contents**\n\n- [Basic Example](#basic)\n- [Express.js](#expressjs-and-pug)\n- [Layouts and complex UI](#layouts-and-other-complex-ui-configurations)\n- [Isomorphic / \"Universal\" Rendering](#isomorpic-or-universal-rendering)\n- [Precompiling templates](#precompiling-templates)\n- [Preact and other custom renderers](#custom-renderers)\n- [`` support](#styled-components-support)\n- [SSR Middleware](/src/internal/README.md)\n- [Full API](#full-api)\n- [Troubleshooting](#troubleshooting)\n- [Development](#development)\n\n(If you want to jump right in, see the [full example project](https://github.com/artsy/stitch/tree/main/examples/6-isomorphic-react-styled-components-backbone-pug-webpack).)\n\n#### Basic Example\n\nIn its most basic form, this library is a single function that accepts a path to your layout, some data, and returns a stitched-together string of rendered, raw html that can be sent to the client:\n\n```html\n
\n {{title}}\n
\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello!\",\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n
\n Hello!\n
\n*/\n```\n\nBy adding \"blocks\" you can begin assembling more complex layouts. Blocks represent either a path to a template or a function / React class that returns a string:\n\n```html\n// templates/layout.handlebars\n\n\n \n \n {{title}}\n \n \n \n\n```\n\n```js\n// index.js\n\nconst html = await stitch({\n layout: \"templates/layout.handlebars\",\n data: {\n title: \"Hello World!\",\n },\n blocks: {\n body: props => {\n return

{props.title}

\n },\n },\n})\n\nconsole.log(html)\n\n// => Outputs:\n/*\n\n \n Hello World!\n \n \n

\n Hello World!\n

\n \n\n*/\n```\n\nYou can add as many blocks as you need, which are accessible by key. Each block is evaluated and compiled, and then injected into the layout. Keep in mind that any field that accepts a path to a template can also accept a component (as either a Class or a stateless functional component), and template formats can be mixed and matched. This allows for a great amount of flexibility within seemingly incompatible view systems.\n\n#### Express.js and Pug\n\n**NOTE!** Each of the following use [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which is available by default in Node >= 7.6.0. If your environment doesn't yet support async / await see the [Troubleshooting](#troubleshooting) section below for an example that uses ES6 Promises.\n\n```js\n// index.js\n\nimport express from \"express\"\nimport { stitch } from \"@artsy/stitch\"\n\nimport Body from \"./components/Body\"\nimport Footer from \"./components/Footer\"\n\nconst app = express()\n\napp.get(\"/\", async (req, res, next) => {\n try {\n const html = await stitch({\n layout: \"templates/mainLayout.pug\",\n data: {\n title: \"Hello World!\",\n description:\n \"An example showing how to take a view structure based in .pug and interpolate with React\",\n },\n blocks: {\n head: \"templates/head.pug\",\n body: Body,\n footer: Footer,\n },\n })\n\n res.send(html)\n } catch (error) {\n next(error)\n }\n})\n\napp.listen(3000, () => {\n console.log(\"Listening on port 3000.\")\n})\n```\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n != head\n body\n != body\n\n footer\n != footer\n```\n\n```pug\n//- templates/head.pug\n\ntitle= title\nmeta( property='og:title', content= title )\nmeta( name='description', content= description )\n```\n\n```js\n// components/Body.js\n\nexport default function Body({ title, description }) {\n return (\n
\n

{title}

\n

{description}

\n
\n )\n}\n```\n\n```js\n// components/Footer.js\n\nexport default function Footer() {\n return

Hello footer!

\n}\n```\n\n#### Layouts and other complex UI configurations\n\nWhere this system really begins to shine is when there is a base layout that is extended by sub-layouts. For example, say you have an Express app that mounts a number of sub-apps, and each sub-app has its own layout that \"extends\" the main layout using blocks (or includes, etc):\n\n```pug\n//- templates/mainLayout.pug\n\nhtml\n head\n include partials/head\n block head\n\n body\n include partials/body\n block body\n```\n\n```pug\n//- apps/home/templates/homeLayout.pug\n\nextends ../../../templates/mainLayout.pug\n\nblock head\n != head\n\nblock body\n if locals.isAuthenticated\n div\n | Logged-in\n\n != body\n```\n\n```js\n// apps/home/routes.js\n\n...\n\nconst html = await stitch({\n basePath: __dirname,\n layout: 'templates/homeLayout.pug',\n data: {\n title: 'Hello how are you?',\n description: 'Views extending views extending views...'\n },\n\n // Can also define locals, which are passed down to components under\n // the `props.locals` key\n locals: {\n isAuthenticated: req.locals.userIsAuthenticated\n },\n blocks: {\n head: 'templates/head.pug',\n body: Body\n }\n})\n\nres.send(html)\n```\n\n#### Isomorpic (or \"Universal\") rendering\n\nThis is covered in more depth in the [isomorphic-react-pug-webpack example](https://github.com/artsy/stitch/tree/main/examples/6-isomorphic-react-styled-components-backbone-pug-webpack) but in short, since the `data` object is injected into the template before rendering takes place, making it available on the client is as easy as `JSON.stringifying` it:\n\n```pug\n// - templates/layout.pug\n\nhtml\n body\n script.\n var __BOOTSTRAP__ = {JSON.stringify(data)}\n\n != app\n```\n\n```js\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n blocks: {\n app: App,\n },\n data: {\n name: \"Z\",\n },\n})\n\nres.send(html)\n```\n\n```js\nexport default class App extends Component {\n componentDidMount () {\n console.log(`Hello ${this.props.name}, is mounted on the client.`)\n },\n\n render () {\n return (\n
\n Hello {this.props.name}\n
\n )\n }\n\n}\n```\n\n```js\n// client.js\n\nReact.render()\n```\n\n#### Precompiling Templates\n\nWhat to do if you have a bunch of old-school Backbone views that you don't want to throw out while moving over to React, but would still like to inject their markup _into_ your React app for mounting later on the client? This library makes that easy:\n\n```js\n// apps/login/index.js\n\n...\n\nconst html = await stitch({\n layout: 'templates/loginLayout.pug',\n blocks: {\n app: App\n },\n templates: {\n login: 'templates/login.pug'\n }\n})\n```\n\n```js\n// components/Body.js\n\nimport React from \"react\"\nimport Login from \"./Login\"\n\nexport default function App(props) {\n const {\n templates: { login },\n } = props\n\n return (\n
\n \n
\n )\n}\n```\n\n```js\n// components/Login.js\n\nimport React, { Component } from 'react'\nimport LoginView from '../views/LoginView'\n\nexport default class Login extends Component {\n componentDidMount () {\n this.loginView = new LoginView()\n this.loginView.render()\n }\n\n componentWillUnmount () {\n this.loginView.remove()\n }\n\n render () {\n return (\n
\n
\n
\n )\n }\n}\n```\n\n```html\n// templates/login.handlebars\n\n
\n \n
\n```\n\n```js\n// views/LoginView.js\n\nvar LoginView = Backbone.View.extend({\n el: '#login',\n\n events: {\n 'click button': 'handleLoginClick'\n },\n\n handleLoginClick: function () {\n ...\n },\n\n render: function() {\n ...\n }\n})\n\nmodule.exports = LoginView\n```\n\nThe template is precompiled, and the html is available from within your React components to mount and unmount as necessary under the `props.templates` key.\n\n#### Custom Renderers\n\nIf you would prefer to use a rendering engine other than React, no problem -- just pass in a custom render function that returns a string:\n\n```js\nimport renderToString from \"preact-render-to-string\"\n\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n componentRenderer: renderToString,\n },\n blocks: {\n body: App,\n },\n})\n```\n\nAdditionally, if you would like to override any default template engines (e.g., what is returned by `require('handlebars')`) you can do so by updating `config.engines`:\n\n```js\nconst html = await stitch({\n layout: \"templates/loginLayout.pug\",\n config: {\n engines: {\n handlebars: (filePath, locals) => {\n return customHandlebarsRenderer(filePath, locals)\n },\n pug: (filePath, locals) => {\n return customPugRenderer(filePath, locals)\n },\n },\n },\n blocks: {\n body: App,\n },\n})\n```\n\n#### Styled Components Support\n\nIf your React app uses [`styled-components`](https://www.styled-components.com/), ensure you've installed [babel-plugin-styled-components](https://github.com/styled-components/babel-plugin-styled-components) and enable server-side rendering via config:\n\n```js\nimport styled from \"styled-components\"\n\nconst html = await stitch({\n layout: \"templates/layout.pug\",\n config: {\n styledComponents: true,\n },\n blocks: {\n body: props => {\n const Layout = styled.div`\n background: purple;\n border: 1px solid black;\n color: white;\n width: 100%;\n `\n\n return Hello Styled Components!\n },\n },\n})\n```\n\nLastly, make sure to mount your styles in your layout template:\n\n```pug\nhtml\n head\n != css\n\n body\n #react-root\n != body\n```\n\n## Full API\n\n```js\nconst html = await stitch({\n\n /**\n * Sets a base path from which to fetch templates.\n *\n * @type {String}\n */\n basePath: process.cwd(),\n\n /**\n * Path to layout template file / component.\n *\n * @type {String|Component}\n */\n layout: \n\n /**\n * Block sections to pass to template / components. A \"block\" typically\n * represents a discreet section (header, body, footer, etc) but can be\n * anything.\n */\n blocks: {\n /**\n * @type {String|Component}\n */\n },\n\n /**\n * Locals represent Express.js locals as they flow through the `req` / `res`\n * cycle. These values could be passed to the following section, `data`, but\n * for the sake of clarity and isolation they're typically passed along here.\n *\n * Accessible from within components via `props.locals` and from within a\n * template via `locals`\n */\n locals: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Data that is passed to templates and components. Embedded directly\n * within template code, but also accessible via `data` (useful for\n * JSON.stringify'ing and passing down the wire for rehydration). In a\n * component, it represents `props` and is accessible as such.\n */\n data: {\n /**\n * @type {*}\n */\n },\n\n /**\n * Templates / Components that are precompiled and passed along as rendered\n * html strings. From within your component, template html is accessible via\n * `props.templates`\n */\n templates: {\n /**\n * @type {String|Component}\n */\n },\n\n config: {\n\n /**\n * Configuration for layout renderer. Right now components are rendered via\n * ReactDOM, but any kind of engine can be passed in and accommodated\n * assuming it returns a string of rendered markup.\n *\n * @type {Function}\n */\n componentRenderer: ReactDOM.renderToString,\n\n /**\n * If you would like to override any default template engines pass in a\n * key matching the extension and a function, e.g.,\n *\n * engines: {\n * pug: (filePath, locals) => string\n * }\n */\n engines: {\n /**\n * @type {Function}\n */\n },\n\n /**\n * If your project uses and you would like to extract\n * styles from your component during server-side renders, set this to true.\n *\n * See https://www.styled-components.com/docs/advanced#server-side-rendering\n * for more information.\n *\n * @type {Boolean}\n */\n styledComponents: false\n }\n})\n```\n\n## Troubleshooting\n\n> Help! My view doesn't render and there's an `Unexpected token (` in my console.\n\nAll of the examples assume that you've enabled [async / await](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016), which comes by default in versions of Node >= `7.6.0`. If you're getting this error, it's likely you're using an older version that doesn't yet support this feature. But no fear - async / await is just a wrapper around Promises:\n\n```js\nstitch({ layout: \"layout.ejs\" })\n .then(html => {\n res.send(html)\n })\n .catch(error => {\n next(error)\n })\n```\n\n> Async / await is supported in my version of Node, but I'm not seeing anything in the browser and no errors in the console!\n\nDid you remember to use the `await` keyword before `stitch`? It's easy to forget :)\n\n## Development\n\n### Commits and Deployments\n\nThis project uses [auto-release](https://github.com/intuit/auto-release#readme) to automatically release on every PR. Every PR should have a label that matches one of the following\n\n- Version: Trivial\n- Version: Patch\n- Version: Minor\n- Version: Major\n\nNo release will happen on a `Trivial` update.\n","readmeFilename":"README.md"}