{"_id":"@abtasty-innovation/react-module-injection","_rev":"4-4aa5d52766dc712d212ca69779bdb12d","name":"@abtasty-innovation/react-module-injection","dist-tags":{"latest":"0.0.4"},"versions":{"0.0.1":{"name":"@abtasty-innovation/react-module-injection","version":"0.0.1","description":"","main":"build/index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","test-dist":"npm run build && parcel test-dist/index.html test-dist/component.js -d test-dist/build --no-hmr","build":"babel src --out-dir build","dev":"parcel src/test/index.html src/test/component.js --no-hmr -d dist"},"keywords":[],"author":"","license":"ISC","devDependencies":{"@babel/cli":"^7.2.0","@babel/core":"^7.2.0","@babel/plugin-proposal-class-properties":"^7.2.1","@babel/preset-env":"^7.2.0","@babel/preset-react":"^7.0.0","bootstrap":"^4.1.3","chai":"3.4.1","eslint":"1.7.2","eslint-loader":"1.1.0","eslint-plugin-react":"^7.11.1","mocha":"2.3.4"},"dependencies":{"@abtasty-innovation/abtasty-api":"^1.8.2","axios":"^0.18.0","prop-types":"^15.6.2","react":"^16.6.3","react-dom":"^16.6.3"},"gitHead":"6b9515d9c0d505aff102d01d7adabcc711852bfe","_id":"@abtasty-innovation/react-module-injection@0.0.1","_npmVersion":"6.4.1","_nodeVersion":"8.14.0","_npmUser":{"name":"abtasty-innovation","email":"pawel@abtasty.com"},"dist":{"integrity":"sha512-m6JTl7tS5AHkT5N0FX4lWgtJtVj5D9/uG4Jj9DhOERlYpnLJunzSfOpD5hlo4G57h1iy7xhUdga7vJsRH4OzCw==","shasum":"e900eaf54e31870a61e1cd9a0a80afd512e8cc98","tarball":"https://registry.npmjs.org/@abtasty-innovation/react-module-injection/-/react-module-injection-0.0.1.tgz","fileCount":36,"unpackedSize":77028,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcF8W1CRA9TVsSAnZWagAAUFIP/0YTK3D3kdsY7F8bTtCm\nGRWgWnKSG8NN29Ft3dCln7lHBbw3JXefdZGEXb+zWLhnmxI6mLnXpsIGgVMe\nLwcXmcfhowgnTHYvYd9aw3yz1xUOOcCKK0K4IONyrU6kIwk36OjFVoh6nCbZ\nqdCEezqzlKKEEJmeFvkHpfO941FPBCUII98OnsjjVkDXwcxCJNPRYgIu0q0J\nSgOpnwfFMou7EDVBWoKiS56GSJ1O8zap/3Jmmf09t1NypY+jS7kYc9s5bntD\njacob4eCBEUq/HWp3uHMhXAz0ziphBdePiDMdhxg5eTrfzlEk9R/6VDB5jbH\nQ2YXYm23PiMhvlHYZDFNskQQGLRB2URt3pblr0WkQHXNInGpMixcBfmX9L/x\ngKH2JJOMeAL2LbcXoDpo4yOsr8m0/KehXEPwCq3l9QnqIbVn8aVELknSOv9H\nIVeTfMiCoKZSN3Rt17yD47MyJNgtOQZRqvya/8Vb8fqCA0R+IeODhITVNxPo\nwbLzGet8eACbHEkJbaOFLHLiP/qcNiJkGqQtNa5t6zH66nJBmpNGzyBVVr9e\nFNubAgYVuS+LOLjtF52X3+zCPSwfBewoEGjn1ID/U89d7q0TrcnYdmzvSAZ5\ngFTyKWAszYUSZYfrSbFj3jS+GJsKsy9HNsIQkLhoGGZha0mYg22jgwvC+dit\ny5Fr\r\n=r1sK\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDKMNTMOnFsYyi5Dhfc1tGDASbajtt3B81OUv0sDI61cwIgUzXkA77Zru/xMulvVXEkYch832w3V24QiqqRutgxCJg="}]},"maintainers":[{"name":"abtasty-innovation","email":"pawel@abtasty.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-module-injection_0.0.1_1545061812357_0.8631932659165211"},"_hasShrinkwrap":false},"0.0.2":{"name":"@abtasty-innovation/react-module-injection","version":"0.0.2","description":"`npm install --save @abtasty-innovation/react-module-injection`","main":"build/index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","test-dist":"npm run build && parcel test-dist/index.html test-dist/component.js -d test-dist/build --no-hmr","build":"babel src --out-dir build","dev":"parcel src/test/index.html src/test/component.js --no-hmr -d dist"},"keywords":[],"author":"","license":"ISC","devDependencies":{"@babel/cli":"^7.2.0","@babel/core":"^7.2.0","@babel/plugin-proposal-class-properties":"^7.2.1","@babel/plugin-transform-runtime":"^7.2.0","@babel/preset-env":"^7.2.0","@babel/preset-react":"^7.0.0","bootstrap":"^4.1.3","chai":"3.4.1","eslint":"1.7.2","eslint-loader":"1.1.0","eslint-plugin-react":"^7.11.1","mocha":"2.3.4"},"dependencies":{"@babel/runtime":"^7.2.0","prop-types":"^15.6.2","react":"^16.6.3","react-dom":"^16.6.3"},"gitHead":"e1f0363949a585530b3e992554d4b690a5495e2a","_id":"@abtasty-innovation/react-module-injection@0.0.2","_npmVersion":"6.4.1","_nodeVersion":"8.14.0","_npmUser":{"name":"abtasty-innovation","email":"pawel@abtasty.com"},"dist":{"integrity":"sha512-kMxsBaIh2N64wtevR0MBIjqaPouA9q8wf2p3mNLjzrhQ+uWVQnSiPY6Ll0ZW6FHVsiXCHpsXhxEZNBHcycGp5Q==","shasum":"2f4ce02d40c452e213537fa61ba8692af29b367f","tarball":"https://registry.npmjs.org/@abtasty-innovation/react-module-injection/-/react-module-injection-0.0.2.tgz","fileCount":35,"unpackedSize":66018,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcF9QoCRA9TVsSAnZWagAAfyYQAJaeKZtAbO3ASEx1l3Ct\n2B7G8bynmz1eGUBtwrOnFAdSnoLXgDd8XuqORKq93y10ZtVWnNdh8vlTFd62\nMlQzzt2Ceeb6dhQiugM/Iv1F/4jvmLoSudMjdTDEyoDxp24OwxfAwuQPmLlx\nc+LJJwFL1VlZ/2Sk2Tg+CPiDoPJE9mADesTUA4wy7jbg1uIDZsPoBb5PtuPf\n8p5bKzUX9AOxpLUaW5r2s4W/ZsbZSBRILT3tNHXfGcHjVdYqIqSN210GyHHT\nMqCcD0ClZPFO4U9Qh81Y33DixwswTaZB1INYGnpPjUWD09t8dB/t8cl3shzk\nBUEjrGZOJevJ7jckor/x5csqUFkyreSL909VyIEobPSNrIO65HoPtkBJ6W7d\nC+M9gsJyx+Yfv1Chazp1lK/IPsg8t+ZQyTmpjMmnsDvzk/kPuOuTqJ2rNU9D\niT0FqIpEIkudSASz2SHZv22+XYnl/gXDWbOmcnSedq380v+y8OJLWwpFXNM0\nxLB1ksnZDoOja9fDT7wVNeHaC5+iVRisCkBPSlvYkIVXjVI4VDjdrt5xiSXm\nGNe37KLysiljFL+IsOLMg4JtT+cVo66gk+ZUVfKm/15vqdk+o8mC+aCHl13P\nOlM+7wsKKr5SbF8Rl0ZLuNW/UUIXxEiQNYg/noMHFh1vGgdBBngfOt1UHGwS\nh4B9\r\n=NVof\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC4LQ2kP+mUt8tRHp2nWhu7lfxqb+6PCeATNDe9lN0McgIhAMbsLXdGABui7fqsUIKpclwjkYPTQJf3M1fmxRHS1j2r"}]},"maintainers":[{"name":"abtasty-innovation","email":"pawel@abtasty.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-module-injection_0.0.2_1545065511748_0.023704650192822863"},"_hasShrinkwrap":false},"0.0.3":{"name":"@abtasty-innovation/react-module-injection","version":"0.0.3","description":"`npm install --save @abtasty-innovation/react-module-injection`","main":"build/index.js","types":"build/index.d.ts","scripts":{"test":"echo \"Error: no test specified\" && exit 1","test-dist":"npm run build && parcel test-dist/index.html test-dist/component.js -d test-dist/build --no-hmr","build":"babel src --out-dir build && cp src/index.d.ts build/index.d.ts","dev":"parcel src/test/index.html src/test/component.js --no-hmr -d dist"},"keywords":[],"author":"","license":"ISC","devDependencies":{"@babel/cli":"^7.2.0","@babel/core":"^7.2.0","@babel/plugin-proposal-class-properties":"^7.2.1","@babel/plugin-transform-runtime":"^7.2.0","@babel/preset-env":"^7.2.0","@babel/preset-react":"^7.0.0","bootstrap":"^4.1.3","chai":"3.4.1","eslint":"1.7.2","eslint-loader":"1.1.0","eslint-plugin-react":"^7.11.1","mocha":"2.3.4"},"dependencies":{"@babel/runtime":"^7.2.0","prop-types":"^15.6.2","react":"^16.6.3","react-dom":"^16.6.3"},"gitHead":"67eb0a7bc8c53495c485d07ccb84bcfa0f050fc1","_id":"@abtasty-innovation/react-module-injection@0.0.3","_npmVersion":"6.4.1","_nodeVersion":"8.14.0","_npmUser":{"name":"abtasty-innovation","email":"pawel@abtasty.com"},"dist":{"integrity":"sha512-D1raLaQGJu8lxq3cg9pUzqnN6Cidu/gOAaeqfeiZEnNIQIn2E+MFrN8adc58tjI7MhQBJqpd83xOICk6HEfZ/g==","shasum":"38a0d876c103a934fa6b8d222e7eebe1b46e1440","tarball":"https://registry.npmjs.org/@abtasty-innovation/react-module-injection/-/react-module-injection-0.0.3.tgz","fileCount":37,"unpackedSize":67413,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcF9qyCRA9TVsSAnZWagAALbAP/jaZolLloFShjFyYnRKE\nWud29Jww46zoxzKW2UlRGQuKBs2h+ubWXWntTtA91qzYEV6YfSQ4mWILELM3\nb0ROLgfmXNb76vXfOwnxgEcL0ycjAoKZVgiyxCpJVI5wdSBf4Fiq28b/PiCM\ndKgpYwwXrkpKy2wGyer5TVkg8WFxScBJGiR+AoyyAGy8/lM8LUUovVcpi33a\nGtz8qcgPozMGd9rXq0dNZLwkSxcuimciBfzSv+sEcI1iuAu6Z8B7PGXvyezu\naV8kfIzDvB3fnCMVBmS5xBuOnQuhUdy5AcQN69oEBP42Y98Ebe+dWXn6YvoB\n1DpPXKPHO9S3SWPmZoZP/ZDvY4qPHKn6LMrArKZA+V1Emzgy2CBjwd2DLt2A\n2imZlWJ3s/wbHCP0R4ABH6VtcyF/Ydz5FmCl9n3MO8Rum0jpfnoQp2rVuF5p\nkS7FUAQddIV3eidympExhmReT/CkX5LGn4/jwd4CNxHPTDdcbRwCdMQWzY8W\n4k17y1yEx71tZ79elgkhjXOxG3YWpbVisx8w0ODmb5TocBaT6ZW4EL3u2KGW\nI+uiZ+PgqeRyGPX6d0ULUvMzh7D+90SYKByc1N1wB/xLVbkEwwWxv1Pk1HVA\nkf74ZmELeIrhZMqDlJWWgvBnW1QuruQf8+EdejJ9I5vTvgE0VliBKt8IZYY2\nEwQk\r\n=ECj2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIA9QxJo5NffTGC+MrrnvauVTa4yvqZ29fg93V8jTGpEDAiB/06B+PcCNO2IKyOpXIZAMk4wtHqUzz1UuOk6GjBHNtw=="}]},"maintainers":[{"name":"abtasty-innovation","email":"pawel@abtasty.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-module-injection_0.0.3_1545067186139_0.8523195334241516"},"_hasShrinkwrap":false},"0.0.4":{"name":"@abtasty-innovation/react-module-injection","version":"0.0.4","description":"`npm install --save @abtasty-innovation/react-module-injection`","main":"build/index.js","types":"build/index.d.ts","scripts":{"test":"echo \"Error: no test specified\" && exit 1","test-dist":"npm run build && parcel test-dist/index.html test-dist/component.js -d test-dist/build --no-hmr","build":"babel src --out-dir build && cp src/index.d.ts build/index.d.ts","dev":"parcel src/test/index.html src/test/component.js --no-hmr -d dist"},"keywords":[],"author":"","license":"ISC","devDependencies":{"@babel/cli":"^7.2.0","@babel/core":"^7.2.0","@babel/plugin-proposal-class-properties":"^7.2.1","@babel/plugin-transform-runtime":"^7.2.0","@babel/preset-env":"^7.2.0","@babel/preset-react":"^7.0.0","bootstrap":"^4.1.3","chai":"3.4.1","eslint":"1.7.2","eslint-loader":"1.1.0","eslint-plugin-react":"^7.11.1","mocha":"2.3.4"},"dependencies":{"@babel/runtime":"^7.2.0","prop-types":"^15.6.2","react":"^16.6.3","react-dom":"^16.6.3"},"gitHead":"803256a5082f11a23d61e55f8d69bca6b28b38b2","_id":"@abtasty-innovation/react-module-injection@0.0.4","_npmVersion":"6.4.1","_nodeVersion":"8.14.0","_npmUser":{"name":"abtasty-innovation","email":"pawel@abtasty.com"},"dist":{"integrity":"sha512-z3kA3/maEWTaq00B3fWLcgjH24KMg6t9vNbNnfWtm/XgoR/qd3t9UXDsRgCLMSmi7+vr7qM3AzyDw7cBRyQeHw==","shasum":"25af946cf6009ddb5a67ecb9f8a773f1f19fba84","tarball":"https://registry.npmjs.org/@abtasty-innovation/react-module-injection/-/react-module-injection-0.0.4.tgz","fileCount":37,"unpackedSize":67601,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcGLrLCRA9TVsSAnZWagAAMHoP/0WeGIXX+va07aheeCPw\nq0W9X1YUMiuryb356/XfyQ7TbR3iCtDGaN5MYMwl6NIta/GFSZo+uvBIMv7y\n91whfD/HYNfYNMmFWPeGx1SGZRYUua7VYTBsRSDoMEskq3Fg9xbrFNf8FOZm\nPblRdCYF/Zn81/P0Hj60qX7Rcgnqj/+daE8zPd1yYePETAMDbiXj8DfqAlYB\nuB/BentgzvAaH7hZMWTEbokd0vxu4MT/q7viuu5W4Y3mk2g7WvF3Rk5kfmqQ\nk4DBV0pG7b8TBV9RwXHPlSzJ0GWMowjrQeOBwaN6oqs0dxc2PCgBW1RT3504\n2t97fIQC3AW7o9dpCnutbTykj7sHaOiysEfoABtZCo7ZsX1ZIbqJ48jDx8t9\nSHsLgYi8L/3nwymOyTmIOqO+0SR5qfEXd2YqlTCzF/SqTykFwjrZHvGyUTu0\nnyUX8QEsPQ/ug0Z4+HgfF9g/HHCn7sbcFd/rx7Y2CYB5IIY9p4ptZXr3r42F\nBLnrz9D0T+ZSOeNu++MIpY2k3+2ENwwTBgrqe5x9WmoWng1AgvfAoDB+MhSd\nko5U04MiEHXYQ1P1gwDZYxp3swaBpyEf6lpU4rCbPksi8yAwe+5xCpzvemIn\ndHVEM19ediR/w1CkxFu9/oMsKG42M47fT9I6ughpeEQkxqKMeopnQahdcInc\nvW+a\r\n=PPk7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDHqv1dJhkSjimaIP/JFr/efiXAoPWx82RuNa54ZqXzXwIhANpiv3umW1WhfivxkmkE/uP6i5EALlv8Le1O5cv7jUQR"}]},"maintainers":[{"name":"abtasty-innovation","email":"pawel@abtasty.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-module-injection_0.0.4_1545124554849_0.9150328806783781"},"_hasShrinkwrap":false}},"time":{"created":"2018-12-17T15:50:12.190Z","0.0.1":"2018-12-17T15:50:12.528Z","modified":"2022-04-04T11:02:56.365Z","0.0.2":"2018-12-17T16:51:51.916Z","0.0.3":"2018-12-17T17:19:46.293Z","0.0.4":"2018-12-18T09:15:54.974Z"},"maintainers":[{"name":"abtasty-innovation","email":"pawel@abtasty.com"}],"keywords":[],"license":"ISC","readme":"# Setup\n\n`npm install --save @abtasty-innovation/react-module-injection`\n\n# Usage\n\n## Wrap a JS as a module\n\nTo run a JS as a module from a react component, do the following :\n\n```js\nimport React, { Component } from \"react\";\nimport { ModuleWrapper } from \"@abtasty-innovation/react-module-injection\";\n\nclass Reporting extends Component {\n constructor(props) {\n super(props);\n this.state = {\n iframeHeight: 400,\n data: {\n initial: true\n },\n abData: {\n accessToken: \"...\",\n accountId: \"...\"\n }\n };\n }\n render() {\n return (\n \n console.log(`event name ${name} triggerd with ${data}`)\n }\n onInjected={() => console.log(\"Module injected\")}\n onWait={() => console.log(\"Module sent wait !\")}\n onReady={() => console.log(\"Module sent ready !\")}\n onUpdatedHeight={e => {\n console.log(\"Module height updated to : \", e);\n this.setState({\n iframeHeight: e\n });\n }}\n style={{ height: this.state.iframeHeight + \"px\" }}\n />\n );\n }\n}\n```\n\n### The props to pass to a module\n- srcUrl : the URL of the JS file to load as a module\n- data : the custom data to pass to the module as props\n- abData : AB Tasty data to pass to the module as props. Contains following fields :\n - accessToken\n - accountId\n - testId\n- onEvent : a callback function that will be triggered when module calls props.sendEvent. Contains following args :\n - first arg: the event name\n - second arg: the event data\n- onInjected : a callback function that will be triggered when module is injected\n- onReady : a callback function that will be triggered when module is ready (abData and event handlers are ready)\n- onUpdatedHeight : a callback function that will be triggered when module inner height changes. Contains a single arg with the new iframe height\n\n## Create a module\n\nTo create a react component that is wrapped as a module, just wrap you component with the `inject` HOC :\n\n```js\nimport React, { Component } from \"react\";\nimport { inject } from \"@abtasty-innovation/react-module-injection\";\n\nclass ModuleTest extends Component {\n constructor(props) {\n super(props);\n }\n render() {\n return (\n
\n

this.props.data :

\n
{JSON.stringify(this.props.data)}
\n

this.props.abData :

\n
{JSON.stringify(this.props.abData)}
\n
\n

Test send event :

\n
\n \n this.props.sendEvent({\n eventName: \"testEvent\",\n data: { dummyData: \"youpi\" }\n })\n }\n >\n Send Event\n \n
\n
\n \n
\n
\n \n
\n
\n
\n );\n }\n}\n\nexport default inject(ModuleTest);\n```\n","readmeFilename":"README.md","description":"`npm install --save @abtasty-innovation/react-module-injection`"}