{"_id":"@azazdeaz/component-playground","_rev":"7-b4ad2aeff0becb7d8520d4312cf690b8","name":"@azazdeaz/component-playground","description":"A component for rendering React components with editable source and live preview","dist-tags":{"latest":"2.0.1"},"versions":{"0.1.2":{"name":"@azazdeaz/component-playground","description":"A component for rendering React components with editable source and live preview","keywords":["React","playground","live","component"],"version":"0.1.2","author":{"name":"Ken Wheeler"},"homepage":"https://github.com/FormidableLabs/component-playground#readme","bugs":{"url":"https://github.com/FormidableLabs/component-playground/issues"},"repository":{"type":"git","url":"git+https://github.com/FormidableLabs/component-playground.git"},"private":false,"dependencies":{"babel":"^5.1.11","babel-core":"^5.1.13"},"peerDependencies":{"react":"0.13.x"},"devDependencies":{"babel-eslint":"^3.1.20","babel-loader":"^5.3.0","chai":"^3.0.0","css-loader":"~0.15.1","del":"^1.1.1","gulp":"^3.8.11","gulp-babel":"^5.1.0","gulp-eslint":"^0.15.0","gulp-open":"^0.3.2","gulp-util":"^3.0.4","gulp-webpack":"^1.3.0","istanbul":"^0.3.13","istanbul-instrumenter-loader":"^0.1.2","karma":"~0.12.21","karma-chrome-launcher":"~0.2.0","karma-coverage":"^0.4.2","karma-firefox-launcher":"~0.1.3","karma-mocha":"^0.2.0","karma-mocha-reporter":"^1.0.2","karma-phantomjs-launcher":"~0.2.0","karma-script-launcher":"~0.1.0","karma-sinon-chai":"^1.0.0","karma-webpack":"^1.5.0","mocha":"^2.2.4","raw-loader":"^0.5.1","react":"^0.13.1","sinon":"^1.14.1","sinon-chai":"^2.7.0","style-loader":"~0.12.3","webpack":"^1.10.1","webpack-dev-server":"^1.7.0"},"main":"index.js","engines":{"node":">= 0.10.0"},"scripts":{},"license":"MIT","gitHead":"0376685c622cb290455b17436c1dc52b5855c66d","_id":"@azazdeaz/component-playground@0.1.2","_shasum":"ee6d15049250e8e1ec3c34470925a4e9ff5be62b","_from":".","_npmVersion":"3.3.2","_nodeVersion":"0.12.7","_npmUser":{"name":"azazdeaz","email":"azazdeaz@gmail.com"},"dist":{"shasum":"ee6d15049250e8e1ec3c34470925a4e9ff5be62b","tarball":"https://registry.npmjs.org/@azazdeaz/component-playground/-/component-playground-0.1.2.tgz","integrity":"sha512-GJArZ7xe7nIw2w6EhNwitUQ2AKe8mO0mYy7iE5tvmJSUiUf62hFrruehCwxYiRl9B1c78tux9CEmfkytKfD5og==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDyAPRBjj2RIjxQSM+fzj5UlZKUwtZXEvH65Gs1hByWeQIgFbfKbPntk2bDltAhwjjn9gRlY+yQuHHwMU7e3bXqh+8="}]},"maintainers":[{"name":"azazdeaz","email":"azazdeaz@gmail.com"}]},"1.0.0":{"name":"@azazdeaz/component-playground","version":"1.0.0","description":"A component for rendering React components with editable source and live preview","keywords":["React","playground","live","component"],"main":"lib/index.js","repository":{"type":"git","url":"git+https://github.com/FormidableLabs/component-playground.git"},"author":{"name":"Ken Wheeler"},"license":"MIT","homepage":"https://github.com/FormidableLabs/component-playground#readme","bugs":{"url":"https://github.com/FormidableLabs/component-playground/issues"},"scripts":{"postinstall":"npm run build-lib","preversion":"npm run check","version":"npm run clean && npm run build && git add -A dist","clean-dist":"rimraf dist","build-dist-min":"webpack --config webpack.config.js","build-dist-dev":"webpack --config webpack.config.dev.js","build-dist":"npm run clean-dist && npm run build-dist-min && npm run build-dist-dev","clean-lib":"rimraf lib","build-lib":"npm run clean-lib && babel --stage 0 src -d lib","clean":"npm run clean-lib && npm run clean-dist","build":"npm run build-lib && npm run build-dist","server-dev":"webpack-dev-server --port 3000 --config demo/webpack.config.dev.js --content-base demo","server-hot":"webpack-dev-server --port 3000 --config demo/webpack.config.hot.js --hot --content-base demo","server-test":"webpack-dev-server --port 3001 --config webpack.config.test.js","dev":"npm run server-dev & npm run server-test","hot":"npm run server-hot & npm run server-test","open-demo":"opener http://127.0.0.1:3000","open-dev":"npm run dev & npm run open-demo","open-hot":"npm run hot & npm run open-demo","lint-node":"eslint -c .eslintrc-node *.js demo/webpack.*.js","lint-react":"eslint --ext .js,.jsx -c .eslintrc-react src demo/*.jsx","lint-react-test":"eslint --ext .js,.jsx -c .eslintrc-react-test src test/client","lint":"npm run lint-node && npm run lint-react && npm run lint-react-test","test-frontend":"node node_modules/karma/bin/karma start karma.conf.js","test-frontend-ci":"node node_modules/karma/bin/karma start --browsers PhantomJS,Firefox karma.conf.coverage.js","test-frontend-cov":"node node_modules/karma/bin/karma start karma.conf.coverage.js","test-frontend-dev":"node node_modules/karma/bin/karma start karma.conf.dev.js","test":"npm run test-frontend && echo 'TODO Server 13, Integration 12 tests.'","test-ci":"npm run test-frontend-ci","test-cov":"npm run test-frontend-cov","test-dev":"npm run test-frontend-dev","check":"npm run lint && npm run test","check-ci":"npm run lint && npm run test-ci","check-cov":"npm run lint && npm run test-cov","check-dev":"npm run lint && npm run test-dev"},"dependencies":{"babel":"^5.5.8","babel-core":"^5.5.8","babel-loader":"^5.3.2","css-loader":"~0.9.0","rimraf":"^2.4.0","style-loader":"~0.8.0","url-loader":"~0.5.5","webpack":"^1.10.0"},"peerDependencies":{"react":"0.14.x"},"devDependencies":{"babel-eslint":"^3.1.25","chai":"^3.2.0","codemirror":"^5.6.0","eslint":"^0.24.1","eslint-config-defaults":"^3.0.3","eslint-plugin-filenames":"^0.1.1","eslint-plugin-react":"^2.6.4","isparta-loader":"^0.2.0","karma":"^0.12.37","karma-chrome-launcher":"^0.2.0","karma-coverage":"^0.4.2","karma-firefox-launcher":"^0.1.6","karma-ie-launcher":"^0.2.0","karma-mocha":"^0.2.0","karma-phantomjs-launcher":"^0.2.0","karma-phantomjs-shim":"^1.0.0","karma-safari-launcher":"^0.1.1","karma-sauce-launcher":"^0.2.14","karma-spec-reporter":"0.0.20","karma-webpack":"^1.6.0","lodash":"^3.9.3","mocha":"^2.2.5","opener":"^1.4.1","phantomjs":"^1.9.17","raw-loader":"^0.5.1","react":"^0.14.0","react-dom":"^0.14.0","react-hot-loader":"^1.2.8","sinon":"^1.15.4","sinon-chai":"^2.8.0","webpack-dev-server":"^1.10.0"},"gitHead":"d717c485425d10d885e28266a3ae3de72534edde","_id":"@azazdeaz/component-playground@1.0.0","_shasum":"d081fc86e7e3019edf3abef8f06be763d906915b","_from":".","_npmVersion":"3.3.5","_nodeVersion":"0.12.7","_npmUser":{"name":"azazdeaz","email":"azazdeaz@gmail.com"},"dist":{"shasum":"d081fc86e7e3019edf3abef8f06be763d906915b","tarball":"https://registry.npmjs.org/@azazdeaz/component-playground/-/component-playground-1.0.0.tgz","integrity":"sha512-oN+u8nzbmZUrZYUrAojl62H4NSV0wP+TLbN+XMjpPCtT9eJt4i/k0HxL5t4+9WwO7qAAvk0zU04GhPvUWGyw4w==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIC9nDd3/J5hseBCGhTsPWWDjHt1oxH9QOl63y+d9rrOlAiEA0FGtq1KYfcQaTGIxFgcJlEtqbpp2H2WWnp0dd7N88vY="}]},"maintainers":[{"name":"azazdeaz","email":"azazdeaz@gmail.com"}]},"1.0.1":{"name":"@azazdeaz/component-playground","version":"1.0.1","description":"A component for rendering React components with editable source and live preview","keywords":["React","playground","live","component"],"main":"lib/index.js","repository":{"type":"git","url":"git+https://github.com/FormidableLabs/component-playground.git"},"author":{"name":"Ken Wheeler"},"license":"MIT","homepage":"https://github.com/FormidableLabs/component-playground#readme","bugs":{"url":"https://github.com/FormidableLabs/component-playground/issues"},"scripts":{"postinstall":"npm run build-lib","preversion":"npm run check","version":"npm run clean && npm run build && git add -A dist","clean-dist":"rimraf dist","build-dist-min":"webpack --config webpack.config.js","build-dist-dev":"webpack --config webpack.config.dev.js","build-dist":"npm run clean-dist && npm run build-dist-min && npm run build-dist-dev","clean-lib":"rimraf lib","build-lib":"npm run clean-lib && babel --stage 0 src -d lib","clean":"npm run clean-lib && npm run clean-dist","build":"npm run build-lib && npm run build-dist","server-dev":"webpack-dev-server --port 3000 --config demo/webpack.config.dev.js --content-base demo","server-hot":"webpack-dev-server --port 3000 --config demo/webpack.config.hot.js --hot --content-base demo","server-test":"webpack-dev-server --port 3001 --config webpack.config.test.js","dev":"npm run server-dev & npm run server-test","hot":"npm run server-hot & npm run server-test","open-demo":"opener http://127.0.0.1:3000","open-dev":"npm run dev & npm run open-demo","open-hot":"npm run hot & npm run open-demo","lint-node":"eslint -c .eslintrc-node *.js demo/webpack.*.js","lint-react":"eslint --ext .js,.jsx -c .eslintrc-react src demo/*.jsx","lint-react-test":"eslint --ext .js,.jsx -c .eslintrc-react-test src test/client","lint":"npm run lint-node && npm run lint-react && npm run lint-react-test","test-frontend":"node node_modules/karma/bin/karma start karma.conf.js","test-frontend-ci":"node node_modules/karma/bin/karma start --browsers PhantomJS,Firefox karma.conf.coverage.js","test-frontend-cov":"node node_modules/karma/bin/karma start karma.conf.coverage.js","test-frontend-dev":"node node_modules/karma/bin/karma start karma.conf.dev.js","test":"npm run test-frontend && echo 'TODO Server 13, Integration 12 tests.'","test-ci":"npm run test-frontend-ci","test-cov":"npm run test-frontend-cov","test-dev":"npm run test-frontend-dev","check":"npm run lint && npm run test","check-ci":"npm run lint && npm run test-ci","check-cov":"npm run lint && npm run test-cov","check-dev":"npm run lint && npm run test-dev"},"dependencies":{"babel":"^5.5.8","babel-core":"^5.5.8","babel-loader":"^5.3.2","css-loader":"~0.9.0","rimraf":"^2.4.0","style-loader":"~0.8.0","url-loader":"~0.5.5","webpack":"^1.10.0"},"peerDependencies":{"react":"0.14.x"},"devDependencies":{"babel-eslint":"^3.1.25","chai":"^3.2.0","codemirror":"^5.6.0","eslint":"^0.24.1","eslint-config-defaults":"^3.0.3","eslint-plugin-filenames":"^0.1.1","eslint-plugin-react":"^2.6.4","isparta-loader":"^0.2.0","karma":"^0.12.37","karma-chrome-launcher":"^0.2.0","karma-coverage":"^0.4.2","karma-firefox-launcher":"^0.1.6","karma-ie-launcher":"^0.2.0","karma-mocha":"^0.2.0","karma-phantomjs-launcher":"^0.2.0","karma-phantomjs-shim":"^1.0.0","karma-safari-launcher":"^0.1.1","karma-sauce-launcher":"^0.2.14","karma-spec-reporter":"0.0.20","karma-webpack":"^1.6.0","lodash":"^3.9.3","mocha":"^2.2.5","opener":"^1.4.1","phantomjs":"^1.9.17","raw-loader":"^0.5.1","react":"^0.14.0","react-dom":"^0.14.0","react-hot-loader":"^1.2.8","sinon":"^1.15.4","sinon-chai":"^2.8.0","webpack-dev-server":"^1.10.0"},"gitHead":"6bd9450296f14e5459d65de5786808f8ee7ebe40","_id":"@azazdeaz/component-playground@1.0.1","_shasum":"b1a9b63b075449d4f3852a323d4b1a82126e592f","_from":".","_npmVersion":"3.3.5","_nodeVersion":"0.12.7","_npmUser":{"name":"azazdeaz","email":"azazdeaz@gmail.com"},"dist":{"shasum":"b1a9b63b075449d4f3852a323d4b1a82126e592f","tarball":"https://registry.npmjs.org/@azazdeaz/component-playground/-/component-playground-1.0.1.tgz","integrity":"sha512-pipmj5yWJDeckQJP+Y5PGZbMsFaATAooYLukSt497NfY6ingoVRfD2QpgomIJMNdMnK4sQjnBP+lyMxJAhgKKA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQChWM17YYZjuYXHjILhsNAxsD+LqqGL5yQwje2SkjwDnAIgDDu7DdTuWrxBooWs+qffmG9J2++TUxSlnOkPXfZu2Yk="}]},"maintainers":[{"name":"azazdeaz","email":"azazdeaz@gmail.com"}]},"2.0.0":{"name":"@azazdeaz/component-playground","version":"2.0.0","description":"A component for rendering React components with editable source and live preview","keywords":["React","playground","live","component"],"main":"lib/index.js","repository":{"type":"git","url":"git+https://github.com/FormidableLabs/component-playground.git"},"author":{"name":"Ken Wheeler"},"license":"MIT","homepage":"https://github.com/FormidableLabs/component-playground#readme","bugs":{"url":"https://github.com/FormidableLabs/component-playground/issues"},"scripts":{"postinstall":"npm run build-lib","preversion":"npm run check","version":"npm run clean && npm run build && git add -A dist","clean-dist":"rimraf dist","build-dist-min":"webpack --config webpack.config.js","build-dist-dev":"webpack --config webpack.config.dev.js","build-dist":"npm run clean-dist && npm run build-dist-min && npm run build-dist-dev","clean-lib":"rimraf lib","build-lib":"npm run clean-lib && babel --stage 0 src -d lib","clean":"npm run clean-lib && npm run clean-dist","build":"npm run build-lib && npm run build-dist","server-dev":"webpack-dev-server --port 3000 --config demo/webpack.config.dev.js --content-base demo","server-hot":"webpack-dev-server --port 3000 --config demo/webpack.config.hot.js --hot --content-base demo","server-test":"webpack-dev-server --port 3001 --config webpack.config.test.js","dev":"npm run server-dev & npm run server-test","hot":"npm run server-hot & npm run server-test","open-demo":"opener http://127.0.0.1:3000","open-dev":"npm run dev & npm run open-demo","open-hot":"npm run hot & npm run open-demo","lint-node":"eslint -c .eslintrc-node *.js demo/webpack.*.js","lint-react":"eslint --ext .js,.jsx -c .eslintrc-react src demo/*.jsx","lint-react-test":"eslint --ext .js,.jsx -c .eslintrc-react-test src test/client","lint":"npm run lint-node && npm run lint-react && npm run lint-react-test","test-frontend":"node node_modules/karma/bin/karma start karma.conf.js","test-frontend-ci":"node node_modules/karma/bin/karma start --browsers PhantomJS,Firefox karma.conf.coverage.js","test-frontend-cov":"node node_modules/karma/bin/karma start karma.conf.coverage.js","test-frontend-dev":"node node_modules/karma/bin/karma start karma.conf.dev.js","test":"npm run test-frontend && echo 'TODO Server 13, Integration 12 tests.'","test-ci":"npm run test-frontend-ci","test-cov":"npm run test-frontend-cov","test-dev":"npm run test-frontend-dev","check":"npm run lint && npm run test","check-ci":"npm run lint && npm run test-ci","check-cov":"npm run lint && npm run test-cov","check-dev":"npm run lint && npm run test-dev"},"devDependencies":{"babel":"^5.5.8","babel-core":"^5.5.8","babel-loader":"^5.3.2","css-loader":"~0.9.0","rimraf":"^2.4.0","style-loader":"~0.8.0","url-loader":"~0.5.5","webpack":"^1.10.0","babel-eslint":"^3.1.25","chai":"^3.2.0","codemirror":"^5.6.0","eslint":"^0.24.1","eslint-config-defaults":"^3.0.3","eslint-plugin-filenames":"^0.1.1","eslint-plugin-react":"^2.6.4","isparta-loader":"^0.2.0","karma":"^0.12.37","karma-chrome-launcher":"^0.2.0","karma-coverage":"^0.4.2","karma-firefox-launcher":"^0.1.6","karma-ie-launcher":"^0.2.0","karma-mocha":"^0.2.0","karma-phantomjs-launcher":"^0.2.0","karma-phantomjs-shim":"^1.0.0","karma-safari-launcher":"^0.1.1","karma-sauce-launcher":"^0.2.14","karma-spec-reporter":"0.0.20","karma-webpack":"^1.6.0","lodash":"^3.9.3","mocha":"^2.2.5","opener":"^1.4.1","phantomjs":"^1.9.17","raw-loader":"^0.5.1","react":"^0.14.0","react-dom":"^0.14.0","react-hot-loader":"^1.2.8","sinon":"^1.15.4","sinon-chai":"^2.8.0","webpack-dev-server":"^1.10.0"},"gitHead":"e736ff3a12f97e3fbe914870a30fe4bb53a80966","_id":"@azazdeaz/component-playground@2.0.0","_shasum":"8d40640332015b0e0f929184e935340f13097d5d","_from":".","_npmVersion":"3.7.5","_nodeVersion":"5.4.1","_npmUser":{"name":"azazdeaz","email":"azazdeaz@gmail.com"},"dist":{"shasum":"8d40640332015b0e0f929184e935340f13097d5d","tarball":"https://registry.npmjs.org/@azazdeaz/component-playground/-/component-playground-2.0.0.tgz","integrity":"sha512-+TrZVQ2aWgphEse37NMOK2QwWB0VMX6//Y5L8NuN1/4nBGPJDxts4a+0CMN3pX/pTMWPYriRMSzcXPuZkhtoJw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDnOmOsmpFnbM9Zw8ydbrVsXcc435vX4AqbuW718a0X8AIgUq9Mvj+oQJ60LacCi4nWqq6X/IN/G2Q56CdaTSVuSpM="}]},"maintainers":[{"name":"azazdeaz","email":"azazdeaz@gmail.com"}],"_npmOperationalInternal":{"host":"packages-13-west.internal.npmjs.com","tmp":"tmp/component-playground-2.0.0.tgz_1458513428247_0.7750160475261509"}},"2.0.1":{"name":"@azazdeaz/component-playground","version":"2.0.1","description":"A component for rendering React components with editable source and live preview","keywords":["React","playground","live","component"],"main":"lib/index.js","repository":{"type":"git","url":"git+https://github.com/FormidableLabs/component-playground.git"},"author":{"name":"Ken Wheeler"},"license":"MIT","homepage":"https://github.com/FormidableLabs/component-playground#readme","bugs":{"url":"https://github.com/FormidableLabs/component-playground/issues"},"scripts":{"postinstall":"npm run build-lib","preversion":"npm run check","version":"npm run clean && npm run build && git add -A dist","clean-dist":"rimraf dist","build-dist-min":"webpack --config webpack.config.js","build-dist-dev":"webpack --config webpack.config.dev.js","build-dist":"npm run clean-dist && npm run build-dist-min && npm run build-dist-dev","clean-lib":"rimraf lib","build-lib":"npm run clean-lib && babel --stage 0 src -d lib","clean":"npm run clean-lib && npm run clean-dist","build":"npm run build-lib && npm run build-dist","server-dev":"webpack-dev-server --port 3000 --config demo/webpack.config.dev.js --content-base demo","server-hot":"webpack-dev-server --port 3000 --config demo/webpack.config.hot.js --hot --content-base demo","server-test":"webpack-dev-server --port 3001 --config webpack.config.test.js","dev":"npm run server-dev & npm run server-test","hot":"npm run server-hot & npm run server-test","open-demo":"opener http://127.0.0.1:3000","open-dev":"npm run dev & npm run open-demo","open-hot":"npm run hot & npm run open-demo","lint-node":"eslint -c .eslintrc-node *.js demo/webpack.*.js","lint-react":"eslint --ext .js,.jsx -c .eslintrc-react src demo/*.jsx","lint-react-test":"eslint --ext .js,.jsx -c .eslintrc-react-test src test/client","lint":"npm run lint-node && npm run lint-react && npm run lint-react-test","test-frontend":"node node_modules/karma/bin/karma start karma.conf.js","test-frontend-ci":"node node_modules/karma/bin/karma start --browsers PhantomJS,Firefox karma.conf.coverage.js","test-frontend-cov":"node node_modules/karma/bin/karma start karma.conf.coverage.js","test-frontend-dev":"node node_modules/karma/bin/karma start karma.conf.dev.js","test":"npm run test-frontend && echo 'TODO Server 13, Integration 12 tests.'","test-ci":"npm run test-frontend-ci","test-cov":"npm run test-frontend-cov","test-dev":"npm run test-frontend-dev","check":"npm run lint && npm run test","check-ci":"npm run lint && npm run test-ci","check-cov":"npm run lint && npm run test-cov","check-dev":"npm run lint && npm run test-dev"},"devDependencies":{"babel":"^5.5.8","babel-core":"^5.5.8","babel-loader":"^5.3.2","css-loader":"~0.9.0","rimraf":"^2.4.0","style-loader":"~0.8.0","url-loader":"~0.5.5","webpack":"^1.10.0","babel-eslint":"^3.1.25","chai":"^3.2.0","codemirror":"^5.6.0","eslint":"^0.24.1","eslint-config-defaults":"^3.0.3","eslint-plugin-filenames":"^0.1.1","eslint-plugin-react":"^2.6.4","isparta-loader":"^0.2.0","karma":"^0.12.37","karma-chrome-launcher":"^0.2.0","karma-coverage":"^0.4.2","karma-firefox-launcher":"^0.1.6","karma-ie-launcher":"^0.2.0","karma-mocha":"^0.2.0","karma-phantomjs-launcher":"^0.2.0","karma-phantomjs-shim":"^1.0.0","karma-safari-launcher":"^0.1.1","karma-sauce-launcher":"^0.2.14","karma-spec-reporter":"0.0.20","karma-webpack":"^1.6.0","lodash":"^3.9.3","mocha":"^2.2.5","opener":"^1.4.1","phantomjs":"^1.9.17","raw-loader":"^0.5.1","react":"^0.14.0","react-dom":"^0.14.0","react-hot-loader":"^1.2.8","sinon":"^1.15.4","sinon-chai":"^2.8.0","webpack-dev-server":"^1.10.0"},"gitHead":"e736ff3a12f97e3fbe914870a30fe4bb53a80966","_id":"@azazdeaz/component-playground@2.0.1","_shasum":"9f4f2e3038db691a102359153abc6c0f5289dc9f","_from":".","_npmVersion":"3.7.5","_nodeVersion":"5.4.1","_npmUser":{"name":"azazdeaz","email":"azazdeaz@gmail.com"},"dist":{"shasum":"9f4f2e3038db691a102359153abc6c0f5289dc9f","tarball":"https://registry.npmjs.org/@azazdeaz/component-playground/-/component-playground-2.0.1.tgz","integrity":"sha512-HA0nldLkxOl3Wv5Zdd6Cmzv0BHq9pbuVwi5C0+sXCsUdwfXuZ5z4zMkIY1/WVrrISut3cL0p+yaqJpBETEUWhA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEMU6IYasbMhOVlTFprk3+jLNvCuOwC1Wo8E69UJYHg/AiEAgt0xRNwypsMMtYXENZWf4ASKjyMrZnZpRjIlv3GE3UA="}]},"maintainers":[{"name":"azazdeaz","email":"azazdeaz@gmail.com"}],"_npmOperationalInternal":{"host":"packages-13-west.internal.npmjs.com","tmp":"tmp/component-playground-2.0.1.tgz_1458513849501_0.9539289076346904"}}},"readme":"# component-playground\nA component for rendering React Components and ES6 code with editable source and live preview\n\n![Component Playground]\n(http://i.imgur.com/se3avpr.png)\n\n### Demo\n\n[http://projects.formidablelabs.com/component-playground](http://projects.formidablelabs.com/component-playground)\n\n### Installation\n\n```\nnpm install component-playground\n```\n\n### Set up\n\nIn your html document, add the required CodeMirror scripts at the bottom, before your bundle script:\n\n```html\n<script type=\"text/javascript\" src=\"//cdnjs.cloudflare.com/ajax/libs/codemirror/5.0.0/codemirror.min.js\"></script>\n<script type=\"text/javascript\" src=\"//cdnjs.cloudflare.com/ajax/libs/codemirror/5.0.0/mode/javascript/javascript.min.js\"></script>\n```\n\nIn the head of your document, either add the css files from the demo or from a CDN like:\n\n```html\n<link rel=\"stylesheet\" href=\"//cdnjs.cloudflare.com/ajax/libs/codemirror/5.0.0/codemirror.min.css\"/>\n<link rel=\"stylesheet\" href=\"//cdnjs.cloudflare.com/ajax/libs/codemirror/5.0.0/theme/monokai.min.css\"/>\n```\n\nIn your JSX, require the component as use it like this:\n\n```javascript\n'use strict';\n\nvar React = require('react/addons');\nvar Playground = require('component-playground');\nvar Button = require('./components/button');\n\nvar componentExample = require(\"raw!./examples/component.example\");\n\nvar Index = React.createClass({\n  render() {\n    return (\n      <div className=\"component-documentation\">\n        <Playground codeText={componentExample} scope={{React: React, Button: Button}}/>\n      </div>\n    );\n  }\n});\n\nReact.render(<Index/>, document.getElementById('root'));\n```\n\n### Props\n\n#### `codeText`\n_React.PropTypes.string.isRequired_\n\n`codeText` takes a string of JSX markup as its value. While you can just pass it a string, I find it is easier to make a separate file and use Webpack's raw loader to load in the raw source. In the example above I use the .example extension, and an examples folder to organize my samples.\n\nAn example file would look like:\n\n```\n<Button style={{background: '#3498db'}}>Hi</Button>\n```\n\n#### scope\n_React.PropTypes.object.isRequired_\n\nWhen evaluating the JSX, it needs to be provided a scope object. At the very least, React needs to be provided to the scope, if any custom tags aren't being used. See below:\n\n```\n<Playground codeText={componentExample} scope={{React: React}}/>\n```\n\nAny module/component that is used inside the playground needs to be added to the scope object. See `/demo` for an example of how this works.\n\n### theme\n_React.PropTypes.string_\n\nString specifying which CodeMirror theme to initialize with. Defaults to 'monokai'.\n\n### collapsableCode\n_React.PropTypes.bool_\n\nAllows the user to collapse the code block.\n\n```\n<Playground collapsableCode={true} codeText={componentExample} scope={{React: React}}/>\n```\n\n### initiallyExpanded\n_React.PropTypes.bool_\n\nMakes collapsable code block initially expanded.\n\n```\n<Playground\n  collapsableCode={true}\n  initiallyExpanded={true}\n  codeText={componentExample}\n  scope={{React: React}}/>\n```\n\n### docClass\n_React.PropTypes.node_\n\nA component class that will be used to auto-generate docs based on that component's `propTypes`. See `propDescriptionMap` below for how to annotate the generate prop docs.\n\n```\n<Playground docClass={MyComponent} codeText={componentExample} scope={{React: React}}/>\n```\n\n### propDescriptionMap\n_React.PropTypes.string_\n\nAnnotation map for the docClass. The key is the prop to annotate, the value is the description of that prop.\n\n```\n<Playground\n  docClass={MyComponent}\n  propDescriptionMap={{\n    collapsableCode: \"Allows the user to collapse the code block\"\n  }}\n  codeText={componentExample}\n  scope={{React: React}}/>\n```\n\n### es6Console\n_React.PropTypes.bool_\n\nTurns preview into a simple console for testing out ES6 code. Use `console.log()` in the playground to generate output.\n\n```\n<Playground\n  es6Console={true}\n  codeText={es6Example} />\n```\n\n### noRender - (Deprecated, Remove at 1.x)\n_React.PropTypes.bool_\n\nIf set to false, allows you bypass the `component-playground`'s component wrapper and render method.\nYou can use this option to write higher order components directly in your example code and use your\nown Render method.\nNODE: This option **requires** that the `React.render` method be in your code\n_Deprecated in favor of writing example components. See #19 for more information_\n\n```\nvar ComponentExample = React.createClass({\n  render: function() {\n    return (\n        <p>Hi</p>\n    )\n  }\n});\n\nReact.render(<ComponentExample/>, mountNode);\n```\n","maintainers":[{"name":"azazdeaz","email":"azazdeaz@gmail.com"}],"time":{"modified":"2022-06-12T15:00:11.827Z","created":"2015-09-10T15:16:02.241Z","0.1.2":"2015-09-10T15:16:02.241Z","1.0.0":"2015-11-16T14:47:57.705Z","1.0.1":"2015-11-23T11:55:03.102Z","2.0.0":"2016-03-20T22:37:11.749Z","2.0.1":"2016-03-20T22:44:12.810Z"},"homepage":"https://github.com/FormidableLabs/component-playground#readme","keywords":["React","playground","live","component"],"repository":{"type":"git","url":"git+https://github.com/FormidableLabs/component-playground.git"},"author":{"name":"Ken Wheeler"},"bugs":{"url":"https://github.com/FormidableLabs/component-playground/issues"},"license":"MIT","readmeFilename":"README.md"}