{"_id":"@abcnews/google-doc-scrollyteller","_rev":"9-9ece0a785fecce7f0d2af8c3d113c663","name":"@abcnews/google-doc-scrollyteller","dist-tags":{"latest":"1.0.1"},"versions":{"1.0.0":{"name":"@abcnews/google-doc-scrollyteller","version":"1.0.0","description":"A scrollyteller preview React component which loads, parses & renders Odyssey-like from a public Google Doc","repository":{"type":"git","url":"git+https://github.com/abcnews/google-doc-scrollyteller.git"},"license":"MIT","main":"dist/index.js","typings":"dist/index.d.ts","engines":{"node":">=12"},"scripts":{"start":"tsdx watch","build":"tsdx build","test":"tsdx test --passWithNoTests","lint":"tsdx lint","prepare":"tsdx build","size":"size-limit","analyze":"size-limit --why","analyse":"size-limit --why","release":"np --any-branch"},"husky":{"hooks":{"pre-commit":"tsdx lint"}},"module":"dist/google-doc-scrollyteller.esm.js","size-limit":[{"path":"dist/google-doc-scrollyteller.cjs.production.min.js","limit":"10 KB"},{"path":"dist/google-doc-scrollyteller.esm.js","limit":"10 KB"}],"devDependencies":{"@abcnews/alternating-case-to-object":"^2.0.0","@abcnews/env-utils":"^2.0.0","@abcnews/mount-utils":"^2.0.0","@abcnews/scrollyteller":"^4.0.1","@size-limit/preset-small-lib":"^4.6.0","@testing-library/react":"^11.0.4","@types/react":"^16.9.49","@types/react-dom":"^16.9.8","husky":"^4.3.0","identity-obj-proxy":"^3.0.0","np":"^6.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","rollup-plugin-postcss":"^3.1.8","sass":"^1.26.11","size-limit":"^4.6.0","tsdx":"^0.14.0","tslib":"^2.0.1","typescript":"^4.0.3"},"peerDependencies":{"@abcnews/scrollyteller":">=4","react":">=16"},"gitHead":"a3ecdcf671d1324865665f4b2e5b3e7c062b8f6f","bugs":{"url":"https://github.com/abcnews/google-doc-scrollyteller/issues"},"homepage":"https://github.com/abcnews/google-doc-scrollyteller#readme","_id":"@abcnews/google-doc-scrollyteller@1.0.0","_nodeVersion":"12.13.0","_npmVersion":"6.14.8","dist":{"integrity":"sha512-vSVDCpmN/agfENt1w9+RlzvJuVB5IpwzvO4EpWy31sARpBnnVekVHzWw1XYHMY6uxMz3iUPEf5y+97XM7bO1lA==","shasum":"dbbacba5e3b1415e38d67fb101cf4c14045ecb89","tarball":"https://registry.npmjs.org/@abcnews/google-doc-scrollyteller/-/google-doc-scrollyteller-1.0.0.tgz","fileCount":16,"unpackedSize":86322,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJft0tuCRA9TVsSAnZWagAArLUQAJ9vh2WXCZ8YsOf+B7uz\nkRMLOohcemVt3/2Ukswme+P4sxPWDbFjz4WRf4UjC4s3P2N2W/2oZuotpT1e\nPTGrC+zytWUa+sFspvrCvSzX22I8EfVqExwaCcobQeg+t+Gov5Fj/PWJ3bgj\n2YS/tEvzFoRCsCgFovlpZtawD2lFO7kEhPA7E3bm9PzNWVI6lluRfqDcp9pL\nOLdEXatMiZ++pKGjyfrliq+wCoHNVdAzK8DgmyfIcxObc2lqlWKMyuOSstG0\nN98vb0vtoGAVQhW+a6CQNvWHZvZbc1LZmSmyY6OdOIUWsUp4WaRsd3BhQzXo\neRAcNlTTQUmtLm/jC+NtUl1/RWKa3E2F9Kl621hkl0ZkHiqdHhCvXTg4OtfC\nd2Eyy8/CoD674YadNDupsrcJ1ncmouw6ZXXwwZGW2ZVioUiwj7sO0SYhR+R5\nFzbENVP4YruSQz5dCe2cPs4o+uKmCQO0oLCBG+H0gW67t/i2odUquk8Vnu/7\nQHFkCbjfSYCQ1tXq9iOnJLvqTmhZ+LKHxwLtTZiS7DvpTPFBSQmZtHm/5IM1\nUA/7My0zBFlOG3be3HI6wki5WMgtU8d6naLEOoofZ/S/6Z1vTOy/bcol53NS\nRZQUE0IARg83AF3mVXBPgp0Oed7528hn1BZKvI09d2ANWBoxYDBhD16MOhuI\neuh3\r\n=0eCJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCcpL2XWJ1bdC3OGEGrAcCd80sG5v2kBRd1NrgQOVOGpgIhAMECwbyxncv2SsSf12D0T8DkMuMgZ5N60h9GwfSvln1U"}]},"_npmUser":{"name":"colingourlay","email":"colin@colin-gourlay.com"},"directories":{},"maintainers":[{"name":"phocks","email":"phocks@gmail.com"},{"name":"drzax","email":"simon@elvery.net"},{"name":"colingourlay","email":"colin@colin-gourlay.com"},{"name":"blakebutcher","email":"blake.butcher@abc.net.au"},{"name":"louisstow","email":"louisstow@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/google-doc-scrollyteller_1.0.0_1605847918327_0.7455308201776241"},"_hasShrinkwrap":false},"1.0.1":{"name":"@abcnews/google-doc-scrollyteller","version":"1.0.1","description":"A scrollyteller preview React component which loads, parses & renders Odyssey-like from a public Google Doc","repository":{"type":"git","url":"git+https://github.com/abcnews/google-doc-scrollyteller.git"},"license":"MIT","main":"dist/index.js","typings":"dist/index.d.ts","engines":{"node":">=12"},"scripts":{"start":"tsdx watch","build":"tsdx build","test":"tsdx test --passWithNoTests","lint":"tsdx lint","prepare":"tsdx build","size":"size-limit","analyze":"size-limit --why","analyse":"size-limit --why","release":"np --any-branch"},"husky":{"hooks":{"pre-commit":"tsdx lint"}},"module":"dist/google-doc-scrollyteller.esm.js","size-limit":[{"path":"dist/google-doc-scrollyteller.cjs.production.min.js","limit":"10 KB"},{"path":"dist/google-doc-scrollyteller.esm.js","limit":"10 KB"}],"devDependencies":{"@abcnews/alternating-case-to-object":"^2.0.0","@abcnews/env-utils":"^2.0.0","@abcnews/mount-utils":"^2.0.0","@abcnews/scrollyteller":"^4.0.1","@size-limit/preset-small-lib":"^4.6.0","@testing-library/react":"^11.0.4","@types/react":"^16.9.49","@types/react-dom":"^16.9.8","husky":"^4.3.0","identity-obj-proxy":"^3.0.0","np":"^6.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","rollup-plugin-postcss":"^3.1.8","sass":"^1.26.11","size-limit":"^4.6.0","tsdx":"^0.14.0","tslib":"^2.0.1","typescript":"^4.0.3"},"peerDependencies":{"@abcnews/scrollyteller":">=4","react":">=16"},"gitHead":"7086f3019d632bff92fb9e872a96f129b975f8f0","bugs":{"url":"https://github.com/abcnews/google-doc-scrollyteller/issues"},"homepage":"https://github.com/abcnews/google-doc-scrollyteller#readme","_id":"@abcnews/google-doc-scrollyteller@1.0.1","_nodeVersion":"12.13.0","_npmVersion":"6.14.8","dist":{"integrity":"sha512-lFwbXLZBM4RIl2W1T2kr5yWUXXKidNqFeVwHoW3LON2MaMNv2wX+fXlJVj0xUih+P5bAR2o2m3O7e6WdvltZjQ==","shasum":"5758b7d626b62f90fe38f975ff53cf68bdaa194f","tarball":"https://registry.npmjs.org/@abcnews/google-doc-scrollyteller/-/google-doc-scrollyteller-1.0.1.tgz","fileCount":16,"unpackedSize":86160,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfu1PkCRA9TVsSAnZWagAAmuYP/RKIUsz4w9JkzVy2CLhi\nz+Q012P4EUPMrgb1WHFNPO2RkmIpqB9WPxXQajwFiaDBlx2tEmS/xCQFnObD\nOFEUrIzD4KxbRXL/ulPSCpcga58/nxsjmZ3hdNupy2x/kOGsPnft/37fPUAP\nj73QCzbT7puOmlI7+hYhYSy1HCCBnt/sMMVrj4HS5qUImIyC9d/yeXpWDBlL\nwZY5+tTI9TIV0OVhHP5spF1e3XoUdqkfmp4bk74GQgSEZRLEBY0CFVs0rxxo\ncUB8AxZRvlu+50DXJN7OYH/HRLi+o8dJY1EbjUzO77d9bjCSK4oE/S8TLK8O\n6kO38gV+NOlyMDI3nud5PZzVQnyyg4nEKi1QFbmN+bOiaIkmjDHWZ3S/8Xxa\nT1W6N+Hc005GWIBgpqiWin61cyQloyAxA0gfK/XJpgD/B62yw749hFErMaOt\ns9aY57jQ6q7RvJJ/HhrfAvoiXFjcYSp2HstpXC/0kLQ2matLqYrPQeg3FHXS\nS/LSRTaX6jmcI3r0i49DeQTTJiYqzs2KYXlXCRAYy+qTndmfUunsNco+rotl\n/alhjDsva/wFkI+Uf69e8Y74kzYnEdd+5d3uGy5Dq+JEcOoSawJ7zTVFSMVg\n6u83mC5jkABfs/Aco7G3KEAVdE+TXVyzByV3DjoRoPDgr5ahVKOGdDVS2Xra\nCkVi\r\n=8d43\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCwmSOtIbuku3di7bku4z0koMJk8ukw0V1SrK67b1pUvAIgcmNuQuuByDYCIeJpB+hAUbYg9rHcnc8dSsiYR0yXo4g="}]},"_npmUser":{"name":"colingourlay","email":"colin@colin-gourlay.com"},"directories":{},"maintainers":[{"name":"phocks","email":"phocks@gmail.com"},{"name":"drzax","email":"simon@elvery.net"},{"name":"colingourlay","email":"colin@colin-gourlay.com"},{"name":"blakebutcher","email":"blake.butcher@abc.net.au"},{"name":"louisstow","email":"louisstow@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/google-doc-scrollyteller_1.0.1_1606112227966_0.7134857651879005"},"_hasShrinkwrap":false}},"time":{"created":"2020-11-20T04:51:58.190Z","1.0.0":"2020-11-20T04:51:58.437Z","modified":"2023-08-10T04:59:31.045Z","1.0.1":"2020-11-23T06:17:08.189Z"},"maintainers":[{"email":"ash@kyd.com.au","name":"ashkyd"},{"email":"hi@jtfell.com","name":"jtfell"},{"email":"phocks@gmail.com","name":"phocks"},{"email":"andy@andrewkesper.com","name":"andrewkesper"},{"email":"simon@elvery.net","name":"drzax"}],"description":"A scrollyteller preview React component which loads, parses & renders Odyssey-like from a public Google Doc","homepage":"https://github.com/abcnews/google-doc-scrollyteller#readme","repository":{"type":"git","url":"git+https://github.com/abcnews/google-doc-scrollyteller.git"},"bugs":{"url":"https://github.com/abcnews/google-doc-scrollyteller/issues"},"license":"MIT","readme":"# GoogleDocScrollyteller\n\nAn [@abcnews/scrollyteller](https://github.com/abcnews/scrollyteller/) preview component for React, which loads, parses & renders [Odyssey-like content](https://github.com/abcnews/scrollyteller/#usage-with-odyssey) from a public Google Doc, as well as creating pastable Core Media rich-text.\n\n## Usage\n\nThe `<GoogleDocScrollyteller>` only has one mandatory prop, a `renderPreview` function, which takes a scrollyteller definition as props (`config` and `panels`), and is expected to return a component containing a`<Scrollyteller>`.\n\n### JavaScript usage\n\n```jsx\nimport GoogleDocScrollyteller from '@abcnews/google-doc-scrollyteller';\nimport Scrollyteller from '@abcnews/scrollyteller';\nimport React, { useState } from 'react';\nimport Graphic from '<somewhere>';\n\nconst Block = ({ panels, config }) => {\n  const [graphicProps, setGraphicProps] = useState(null);\n\n  return (\n    <Scrollyteller\n      panels={panels}\n      {...config}\n      onMarker={(data) => setGraphicProps(data)}\n    >\n      <Graphic {...graphicProps} />\n    </Scrollyteller>\n  );\n};\n\nconst App = () => (\n  <GoogleDocScrollyteller\n    renderPreview={(props) => <Block {...props} />}\n  />\n);\n\nexport default App;\n```\n\n### TypeScript usage\n\n```tsx\nimport GoogleDocScrollyteller from '@abcnews/google-doc-scrollyteller';\nimport Scrollyteller from '@abcnews/scrollyteller';\nimport type { ScrollytellerDefinition } from '@abcnews/scrollyteller';\nimport React, { useState } from 'react';\nimport Graphic from '<somewhere>';\nimport type { GraphicProps } from '<somewhere>';\n\nconst Block: React.FC<ScrollytellerDefinition<GraphicProps>> = ({\n  panels,\n  config,\n}) => {\n  const [graphicProps, setGraphicProps] = useState<GraphicProps>(null!);\n\n  return (\n    <Scrollyteller<PanelData>\n      panels={panels}\n      {...config}\n      onMarker={(data: GraphicProps) => setGraphicProps(data)}\n    >\n      <Graphic {...graphicProps} />\n    </Scrollyteller>\n  );\n};\n\nconst App: React.FC = () => (\n  <GoogleDocScrollyteller<PanelData>\n    renderPreview={(props) => <Block {...props} />}\n  />\n);\n\nexport default App;\n```\n\n### Optional props \n\n**TODO**\n\n- `preprocessCoreEl`\n- `loadScrollytellerArgs`\n- `postprocessScrollytellerDefinition`\n- `renderFallbackImagesButton`\n\n## Development\n\nThis project uses [tsdx](https://tsdx.io) for build/dev tooling and [np](https://github.com/sindresorhus/np) for release management.\n\nThe recommended workflow is to run TSDX in one terminal:\n\n```bash\nnpm start\n```\n\nThis builds to `/dist` and runs the project in watch mode so any edits you save inside `src` causes a rebuild to `/dist`.\n\nThen run [the example](#example) inside another:\n\n```bash\ncd example\nnpm i\naunty serve\n```\n\nThe example imports and live reloads whatever is in `/dist`, so if you are seeing an out of date component, make sure TSDX is running in watch mode as recommended above.\n\nTo do a one-off build, use `npm run build`.\n\nTo run tests, use `npm test` or `yarn test`.\n\n### Example\n\nMostly to aid development and demonstrate usage, there is an example project in `/example`. It uses [aunty](https://github.com/abcnews/aunty) as the build tool to match the usual ABC News interactive development work flow.\n\n### Jest\n\nJest tests are set up to run with `npm test` or `yarn test`.\n\n### Bundle analysis\n\nCalculates the real cost of your library using [size-limit](https://github.com/ai/size-limit) with `npm run size` and visulize it with `npm run analyse`.\n\n### Releasing\n\nTo release a new version to NPM run `npm run release` and follow the prompts.\n\n### Jest\n\nJest tests are set up to run with `npm test` or `yarn test`.\n\n### Bundle analysis\n\nCalculates the real cost of your library using [size-limit](https://github.com/ai/size-limit) with `npm run size` and visulize it with `npm run analyze`.\n\n### Optimizations\n\nPlease see the main `tsdx` [optimizations docs](https://github.com/palmerhq/tsdx#optimizations). In particular, know that you can take advantage of development-only optimizations:\n\n```js\n// ./types/index.d.ts\ndeclare var __DEV__: boolean;\n\n// inside your code...\nif (__DEV__) {\n  console.log('foo');\n}\n```\n\n## Authors\n\n- Colin Gourlay ([gourlay.colin@abc.net.au](mailto:gourlay.colin@abc.net.au))\n- Simon Elvery ([elvery.simon@abc.net.au](mailto:elvery.simon@abc.net.au))\n\nSee the [full list of contributors](https://github.com/abcnews/google-doc-scrollyteller/graphs/contributors).\n","readmeFilename":"README.md"}