{"_id":"@apollosproject/ui-onboarding","_rev":"517-4cb3472832e7dd3f50f63c91b955e412","name":"@apollosproject/ui-onboarding","dist-tags":{"beta":"2.0.0-beta.1","v1":"1.8.0","next":"3.0.0-canary.60","canary":"3.9.1-canary.24","latest":"4.1.0","v3":"3.10.3","v2":"2.47.9"},"versions":{"0.8.5":{"name":"@apollosproject/ui-onboarding","version":"0.8.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.5","maintainers":[{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"e4940aa8b85767b3004a53d7d31e65e0842e5cda","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.5.tgz","fileCount":65,"integrity":"sha512-vw4qSQAoxnvJC9ze3eMr5vP26ry7uJm8O4j7fqZG09g+tbNO6+5K3CKz6ujITpImoPILdapE/drGnqeKOcoMxw==","signatures":[{"sig":"MEQCIG/MaxEkpQ8SoywgwbKI278I9oTZi4boI1/AgdjNTBeiAiAaObkxodoEGd+Ua5TVNN2oRZk1pqULw322YZHOybMOEw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":667125,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc0wv6CRA9TVsSAnZWagAA3LYP/ApjUQvUEfBdzi0A+WrC\njdbf0/EU9eg+jia/aku6mVcBpzFON5nw1WQsco/zRjVZ7eRVvDlTbH/jDHhx\n/G6UDJL+VVvS/G1bq5zzooTkYU1HoNC+N+A+AAdDHmZN25PqOtKTatjFnq6d\n9QrIR0rBDHOQ8ElVorfyYf8CB8ly7RTz67eybB4GLefUel5V5atGeY+OVDZs\nGb93EvF2oxdblaCX+OBRDNpLP1bmCS0k06+18YmsziQYPmLwrXkUc5SkktQl\nLPbpHHvOGVV6HlJLmmq3csR8AEZlez/M3+8zPC7sXbge4btRV4OwJBJHTMwc\n5mACWFhjdEzXVinIzRjdMMDtkWA9Z6Vxr6inzQcqYdNn0wDMKG1SomGTQ1pB\nkArudwc5hdWPgA44gtdJ12IBtKfeJ44+slbWUDdToQir6/N/XWQ2OT4TCMyR\n1CUjxCthmdOs0oOGbVREvc4ve79S9bpxSevlN83L8S1dOsfkYXpqmn9vBc82\n3pmc4FkTBqhxmVxxjrTXeuIS9LuxhyI7lwtKQ2056PzdMnb8pw1SWB4LsqRt\nC6he2X8Tgp1DEmyos13Jha1iCw6z/dgPS9AOmUawOi4qwBXXdQIqN/dyBaAH\n4XuowFIInvYs+p7ClriSF583KVXUv4R9TFkc/AWCyXWMV1/EP32UO16QCaBq\nnCL/\r\n=VX1a\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"]},"main":"src/index.js","gitHead":"f1b26eb69e73cccc071d96cbcfee021e84917b52","scripts":{"lint":"eslint ./src --ext .js","test":"jest"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.13.1/node@v8.13.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.13.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-navigation":"2.11.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"23.6.0","react":"^16.8.2","waait":"1.0.2","codecov":"3.1.0","react-dom":"16.6.3","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.58.5","apollo-client":"2.5.1","react-navigation":"2.11.2","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@apollosproject/ui-kit":"^0.8.5","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollos-project/ui-kit":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.5_1557335033607_0.6528073253829623","host":"s3://npm-registry-packages"}},"0.8.6":{"name":"@apollosproject/ui-onboarding","version":"0.8.6","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.6","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"2ea534ad1f157181fbbb22422dd8e590732f7a1a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.6.tgz","fileCount":65,"integrity":"sha512-o93KZPBvwUexHkYXGycLjiPnxXHIi9tB+brtw+ciNgFLbzv4sTdvR24JOom8uHS3iLfjq1pKqmjbyXkhccs6vw==","signatures":[{"sig":"MEQCICzim6QBylQaiP6cRUqvWTSfI/3K4LfpmS1wJTVZIgKnAiBSgdRx4zuAzWlAaOLOaqJiIrU4g7QCbfrM86v50VI6nA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":667257,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc2uDhCRA9TVsSAnZWagAANU4P/izEhsWw73dKvDeFoXCa\nGLQh7JSJiS71xIIR5ZR+CrKqW+I+BNlv1dxKTzy86lQcHJoa1W6B3glYKyP1\nqfnGfQB/cqqANA8uo4tHe0omz8hV61rZkOkSjeOQ+4oFV2/Oq02Y0qfWtnNO\n9KQnL2hPbzozTi9/SnKvkNhQ3ylA+CpLaEyIolwX37q7FCp/2QfLuG5QVpL/\ncMR6PGAhVJY7YEvKQKJSG42THLESVPg3/lTIzQKYNYAKlLobowVL88g2sq9K\npChz53CXM98F9RfXGHq8HnOXYWko/5f2t6wK3Zruk8VTyPOW6iLUuJlV9Qi1\nJUpepiAmdLw1mQz4TFvuYzT4ZQMIAtY7apdK3LueednnmwY26Wd1Ya2/q8eL\ne6Vb+Xh/JjcOrTDIyfS3Rz0uR0nAAgBRBBbcwX1jS/jEu873Hjqz9lLWcyCf\ny224+NSxzCGsfW1YYSYx7w2hDrCgkp85bVoFW76dnJ9ex7sP7/VeR7VM3COd\nWdqe9yXWmGDJ0y+Xet7+k488CgqCrc+rew5cdccMSK8/FIR6vOq+68ao5MVC\ne8Jw34IVGc9hiJWJy9AdyHgoMvzDknb8oydLgClMl2UPYleVl7+uXYCL6D3+\nzHEWuKoBbGBK8SFFFaqgRjhEEtIcLPHZ9kMsHpKy//zoB3WTjQdtIprJe8Xv\n9ym/\r\n=DEKe\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"]},"main":"src/index.js","gitHead":"009802439cf84b81f924d1b14da224034fdb12a4","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.13.4/node@v8.13.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.13.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-navigation":"2.11.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"23.6.0","react":"16.6.3","waait":"1.0.2","codecov":"3.1.0","react-dom":"16.6.3","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.58.5","apollo-client":"2.5.1","react-navigation":"2.11.2","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@apollosproject/ui-kit":"^0.8.6","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollos-project/ui-kit":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.6_1557848288797_0.35913099532970905","host":"s3://npm-registry-packages"}},"0.8.6-alpha.9":{"name":"@apollosproject/ui-onboarding","version":"0.8.6-alpha.9","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.6-alpha.9","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"070022462e282cdcec5eed3e0a9a45683e596e43","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.6-alpha.9.tgz","fileCount":65,"integrity":"sha512-uQUItuQvk/iHW98cQbzHdfEc63B+nJiqbwig7dKM4VaVdJ3uqDQPmLgtAXL9CAjd3GfeaBUhrCjiaT25zE5p3w==","signatures":[{"sig":"MEYCIQDqMr2arji1gW0m9GtMkNIIkWHTUzAaxPowyUJ36sWKwgIhAIRWO7SPPrcw55obpkEvyUcZWFdQOQrClU3d+XhNBQhk","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":667289,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc2xyECRA9TVsSAnZWagAAwTMP/iGYU8xWffiBMcPwHWnN\nzxdpTJYideZrjNh7pODEMYYIM27aHdIe6+2EA24JR0c3TyDxnjWkQBhJgL20\nbfv6QwVwjVZXUKVBlJorq6SKT32uvB+Qa2fBoA13a0dm1xHAgZGPJwwQ4Kbx\nyxDxSOnOI8Nap/RMyUndmsje5Ob/frZ+7Fi1gneXQFrbis2d9qfHtxWhWo4Z\n0BQnGmnbK4zf4KlXoxqVf8HML2FHAqNC1O8fEbctRz0u8GBSL0RFGJw2Bi+O\njhxq8KD0cQ7bmP2Ul5Btcyqlrhk0fNon1uJ9JZaday8eo1NCoVQc+FZtmKga\n+5Djxep+wVg2dy0koFoVNxJDSIAcJiKc5cLI40JIJdx5DSCvdNL+TbGnXvGs\nMpEo3fjmVXJRDlMwoC1UKcEkSAoSRgppsI7j8D3heWTHwS/pUgy2LMS2erkB\ncp1g5zSWticC9n0RiMkflfJcQ56LFkpXil8MAqgB205ZqvMPxm1LZVbI7eZ/\nwO66kuhcuDa6MQGQZ/2/VBzAecgKqn7mDpt8cCt0++JX+PdRzaZA3Q2pCR+4\nWcfNs6x6Uw9aL4CxCKsb6ZGiho2bxhXcTFDeKfBI2guSuxIDxL2cbFJKxbg5\nWsjjr0reDi44SBasVMyDH4wZTeESVjdUzxDDyPDLCBxSm7OJKq2aCdMmPV5D\nPQSB\r\n=RbVP\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n","gitHead":"523ea1c319ef5eb06038ee373a63fb4f0acb0d4b","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.13.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-navigation":"2.11.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"23.6.0","react":"16.6.3","waait":"1.0.2","codecov":"3.1.0","react-dom":"16.6.3","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.58.5","apollo-client":"2.5.1","react-navigation":"2.11.2","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@apollosproject/ui-kit":"^0.8.6-alpha.9+523ea1c","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollos-project/ui-kit":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.6-alpha.9_1557863555322_0.9538823511195162","host":"s3://npm-registry-packages"}},"0.8.7-alpha.1":{"name":"@apollosproject/ui-onboarding","version":"0.8.7-alpha.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.7-alpha.1","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"175472ef9e43ab19de7176a0446bc9205f561d45","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.7-alpha.1.tgz","fileCount":66,"integrity":"sha512-RGEXcKL6ep1nwQJdBBxthuj+r/JW1QkVGu1jOCxL62MOQjxjY9uOFNz4aGpVmobcCPHXId9+gvuprzKWypxE1Q==","signatures":[{"sig":"MEUCIQCLLokP/nsdOmIzsskA1Ow8uBizIZGc7y+FrnyMApg4wQIgLvO7+aqOzdVmi3MLDfo6hlV7hiaS66LDD1S5Ipa+VWk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":668295,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc3Bb5CRA9TVsSAnZWagAA1RoP/irsCoNAi09zuC2QNypV\n247Xn9ls7bEO459bca0on32NCQYBPpBB3O+RpewKbzdulZ2VAYKUeo+JyhpP\n5Auz5quVsDwgeJE93wB6vI2eJefVFzvNXDr6TCUkdldcEYyjmFRk+Js+RrUR\nTL9rQMmWhjRFhvaeZziQMLRvi8/3en+orWqx/fyQfrCte2yLMrxcaIa2ftQ1\nyuEhvvutb3n2Ka/3iNXT4biGDpZKWKAifRA69IQtk4m9yOeRGe4oX2l54T4Q\n5/+7OfRAFAglcdVnWxlxBKX9dFnH3AH09WcbeD1L7bSonuAwy/0r6Sg0Ms73\nbrztgQzoZt7sNSkoj9T3eASbSqQUvvZk3HkGLHKBXuYft9KkhQXv8EuzzNUk\nzxl8en9TCBIzTug7qz7tjHegVALs6PLw8lMbwH7OH0jix7Ibh65DDuFmMmU3\nS1+fD0Gv2lp8qafuHpBfWK6zwmaD/XuF9mG2eqZFbGxSIsUE2sNOTO7b8HGU\nfWe4fFo03QITxD5ZD4pChEZCmQcUOR5QceOaHHKntvrLqqWt0K6R4YUQCvPx\nabRyV3MJEqOBPX3VDzse1qDCJ9raTYOBJhqam0RfsaQmLBDxIe0C/KwqHk4V\nguK3kGbE8cz3JJ2VC2NvLMjeX4tQNm2grXry3yUpXi2/8Z9zoKqlwZuQG648\nNrLV\r\n=z4Tw\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n","gitHead":"3a1addb2dbc57e1898a1ea534f03bca21cfa5f15","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.13.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-navigation":"2.11.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"23.6.0","react":"16.6.3","waait":"1.0.2","codecov":"3.1.0","react-dom":"16.6.3","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.58.5","apollo-client":"2.5.1","react-navigation":"2.11.2","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@apollosproject/ui-kit":"^0.8.7-alpha.1+3a1addb","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollos-project/ui-kit":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.7-alpha.1_1557927672255_0.7444892906714606","host":"s3://npm-registry-packages"}},"0.8.7-alpha.2":{"name":"@apollosproject/ui-onboarding","version":"0.8.7-alpha.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.7-alpha.2","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"c769d617ec20d994a6fca67b1edbb6eaaa9e0ca9","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.7-alpha.2.tgz","fileCount":66,"integrity":"sha512-Yb5cKHTWZOa6Q+Mh4s5C6lZiHS3tu9BD1iSNm8s5c6qde5p9UPbqlRhxVhwmA/62/hNvZIGfSjrYm/oS+TDwng==","signatures":[{"sig":"MEQCICplLSqtavGS5gn7ELTbeIOHQi0lC4fgDMOa1l6CaeF5AiAFVqjot+Bc7nXB0pLwnjMb21XgQMdkjveuLB2+cGxr6g==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":668295,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc3Fo8CRA9TVsSAnZWagAANuMQAITPkWb52QzdCiCylSgD\npqrv5fyUM5c/VV2/nt8NyXcPK/uePFhNZ6I9OYe1pjY3f7v1ylxtZvKWc1qu\n7/Lrx/TIucnr9qqDOy8S5ibSB6gPmv2BI54Pd7uJYwr89+zwvPLYprjq21Y9\n8/t2mC4xRy2bKGGRcWQhzkN6UtmAkKFg0OcInUCFFV1XMKk+qvKTrJaYuOwE\nLiWX0SKIN8bVUy0HgkMJTHswGCrdJImqE9MHg6bnRAdTEBm1hWWj451Yk+oZ\nDasFDK4cb/lIm7Nh8IL3HC4toDzB1Y1MSu4gZSEsbIYlkc9p5sRCKvR+dT60\nKMG3705p1JboxmWDQJc91sM2sV2ZYtGAZW8QwMu7FSmJIxBO0LmDWafu+xRk\n8/2vXHqOuf6DCQ6obWb8EXpyo1+QX5Ee0QWdZKXceVjKk4C6bh6/zJBBToOB\nz4lWk2JQljLHdtFwVDspdXnRhT+v4I8JFlkrJxm+7hUjP0CH54egqdMNV/Ll\n3huS7qHKJ2x54j+wNQNtMM0s2pv0mwPJI8YuFL7kqmCgrKP7nIOH+rgKNoz0\n0aw7CAcpxVob5o2folYxqIaw8ubqv4dqfEpv7SDuB1A+qfRC/iTpz2ncWBV7\nXuxwiTI53s3HKmoEK44b4I9pWj0WKLWuT51sUFS56zGUTWJzHcBqiI6C8Dub\nQRo5\r\n=Ijqi\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n","gitHead":"b40db5c8f62ae69b1c5ff38d4eb71f53e7a788c0","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.0/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-navigation":"2.11.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"23.6.0","react":"16.6.3","waait":"1.0.2","codecov":"3.1.0","react-dom":"16.6.3","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.58.5","apollo-client":"2.5.1","react-navigation":"2.11.2","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@apollosproject/ui-kit":"^0.8.7-alpha.2+b40db5c","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollos-project/ui-kit":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.7-alpha.2_1557944891986_0.6365515996033229","host":"s3://npm-registry-packages"}},"0.8.7-alpha.9":{"name":"@apollosproject/ui-onboarding","version":"0.8.7-alpha.9","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.7-alpha.9","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"3c4db00819118425953375ba5c3c139265314345","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.7-alpha.9.tgz","fileCount":66,"integrity":"sha512-k/3xdEaEkxFdLQkb8YmzUtTePHWfRd2ki303d4Y8Memrw2N0bVflu36FDrm1vPGtkqiqM5P/jb+0eZjdkYSeTw==","signatures":[{"sig":"MEQCIHMHLVD7ouDYDRlHib4H96H45a87Qz7CtA4xDaDuCIYgAiBmRTvWdLxxNoSl2dVjzgmS9HB2JSxTd2dLRAWZ4AC/5g==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":668227,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc4vl4CRA9TVsSAnZWagAAUSoP/iIlguUctWLXEtBZajd6\n7Xv3QHAK6Aq7b2uYyHsaIcI6YclbvxTRuqLJUhw8d4af7E0ggoCehI7BCk96\n91L1tqL87G+Hahl34FNfoetWT1QA4t+vRkneQrsdTG9/mH2Fbbh3BXKpcAsv\n1XLNDObhaq2HM/OjY6vfiL/rczs0J3H3Gs8DnAtxze0pKnweE0y4RoDpfeC4\n9CxLtcgrPdSqBGPfN7hB+1z30n4m3IZ8bvSQOPQQwZnYyiTtBl9fFVdqm934\nHOYHwL3tlIZET6to94p1iktyJCi1jOimAoQCEz6T4dn5WfBIbMsaSzzjG5Nq\n4lCVjyD5BvrY2Nsm92D1tteTbm/S5fIUfstUZb0WeN/6olganZVt93H2xE5U\nCKetSD5TLOBR4svhtX1nLWZFD+yiwknqlsgEBErknWAnXcFh8adTo4DojJWk\nbuNxukq53nzchmbDgOTAaq9Dkd52mJT5wZCrzV7BFOajXvwKq6ciyc34DiTc\nJupJiNQebsH70ToxRTWLetUIM4HHzAQrgHpwq/g9ERMwbvDOrcEoYIb/sfHq\nxEzSe0rxH/N6OvpUBDXewE/8T3Fffe0SoNhfBCZIzqk6B0PFVCuPTKHdkdXC\nLLS5aa+VdjqC5T1geBhb8rbZ8sCoFkLV6tdZ3zYAfbAexOi5GhaciUVocz7A\nNDLK\r\n=0Od4\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n","gitHead":"e27bbf2a98dd66f9d3f21812401ebd35b064b9bd","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.0/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"23.6.0","react":"16.6.3","waait":"1.0.2","codecov":"3.1.0","react-dom":"16.6.3","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.58.5","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@apollosproject/ui-kit":"^0.8.7-alpha.9+e27bbf2","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollos-project/ui-kit":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.7-alpha.9_1558378871844_0.3084869098136227","host":"s3://npm-registry-packages"}},"0.8.7-alpha.15":{"name":"@apollosproject/ui-onboarding","version":"0.8.7-alpha.15","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.7-alpha.15","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"35f4666000af8997b18676fbbd35b38e416b3790","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.7-alpha.15.tgz","fileCount":66,"integrity":"sha512-RRuEyIGMb+mdpd7efUflitcF+ragksiemG/n8OYtMm4Qrd86L6UO8mcBWz0AEP+I72HM3wCzWli95AzhgHDN5w==","signatures":[{"sig":"MEUCIGh5rtII7HnMPVrqIYPj0vbvbgttuX2CGjL1+/jmwfkvAiEAmv/d/o3cAu5fm4h8/fqgGJ8WRlea0pkEvxDGA3QpkD8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":668159,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc5vh8CRA9TVsSAnZWagAAAgUP/3nQ+v2kKLKxoJ/XYeqz\nOSS3TH7z5s4JK+Y3rVvLBxq94z8/XE5V3IQ1WGlfvR9M7ipQcWCXe6Utp/Od\nRSVXeZdEoQDhWQKROZoCs6Zjkt0mVEep1GqnPTNn9hwzwv1DBZzapnfrJnZQ\nXuP0ZjdchNXA2+9TWwU5yzVSPBOUghxdlXHfAK/ttUOCDTyw8IsOlGAPEBBt\nuIBCtU2IlnwCx/2wAk07ze/PVN1tT8/1V4iPJ3A34b9ftSWxN50uHDHFQ+vi\nvu5kLqvizcOTaLa7in2JQFE+FQDGC+eSRMbGQdU2cKKxld2JprsxD07wHZpA\ncJaXDQgb1qvsk54oVRbSq0z1L748E/blO/SL8iEeIj5NDCsUPzJ9iiSTZYJl\nR1i15YPIhWi4ccAVCs9Gms64HxXmXqBu43IL/eAsrjFRET8BL87SywCop9XT\n3QhVNocmGDjX8W+V5z/hjnRtnI/o/06JlzAbh7KUGu1OrZY5iUzSXg2i+rJn\nP9esf7xI73pZNERK/imwqfQcKWnHhRvblNPo686bKogf08WkAZ3idDWVLBxz\nDZ9c4p0QDeY/L38Q0ad+1jzSBoVaOPxgjaUROvbRbS8SaJDOmui49M7q6YDa\nhChNhu/qcsS/Qs1ypqDsKnFi/lT1Ih+cqy8NFPoLzyKHmF4gYY+SNn+l0Qc1\n+rfq\r\n=38dN\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n","gitHead":"c1ef92432f087638185d1b298a83bd4e706130e4","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.0/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"23.6.0","react":"16.6.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.58.5","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollos-project/ui-kit":"*","@apollosproject/storybook":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.7-alpha.15_1558640763432_0.963629740804226","host":"s3://npm-registry-packages"}},"0.8.7-alpha.19":{"name":"@apollosproject/ui-onboarding","version":"0.8.7-alpha.19","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.7-alpha.19","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"e363ac97c97595a52218a62b4d382488b4d1a3d2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.7-alpha.19.tgz","fileCount":66,"integrity":"sha512-brj5Pu5BHOBu8glYCXTAvaUO+gnNZ9mfnk2LactJ8BTQ/bzsyVaLAtEU2nFLLOzY3c4VPNLvl1OxUqTdRv5SEA==","signatures":[{"sig":"MEYCIQDyOEp3LwqNJfRbL1EDo7SK//oyOS3BJ3tQvo/fj9bk7gIhAOdUDhbffGWMtk3Hjh6DTgS7kR6JX56Y+Nl237BzXM4q","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":660571,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc7Zj8CRA9TVsSAnZWagAAa28P+gJM3KfiyOpASGMyu5kq\nk7VwNTn2g8x3cfgLT6mCkYWqyOdJNlNAvFSIPH3XC47pW4GYhT8EulercEdF\n3OYYIY1jF+bmmxgX4k1tS0CjqRGPdv8hKCfJ9l3KXwFvxlDI9j7OjoyUsqjY\ngT6R5sbriOYJ6wTZMDK2pIVy8aEOPKRvfXVnSu11sydyCid88eQ/G/Yvpu7o\n4NCcdQ6L1mk7XSpY/wbNDLX6/S5eyOdHCmxgvdrrYxsGc3ZnPAe+eYbrR7/p\ngOuQ808VxNdba16DYr9bx6zXg3yBYqSVQlWRACkSMCxTQtohTyomKkxgTNK/\ncpx54065uFg1GuvLvx933GnP71pw29QIv8+oZE50WVdy/ptUYuYIUkMrxa3y\nAT5/nP23YP2hXWj2koDMYoR9DpxYtRRmHBpLJslahP0RxMg3bwlS1a2Wxirg\nVaqdx76sNAtV5BYPvSeTu2tc5jUgsl/kjg81ry6nE8xz2SrrGTaWjl9O4tnP\nrkFsTG8B4zLcPLt8pATRsll40LYbJ2IBWJj0PY8Yxd+X4L84pOCSk+NWdHlD\nMaRo8IgJQq0uEPupNCBwXxyuEZjnyeK3gYNPWNhpABa34d9Yy1d1zA6+7sOS\nhe7CNML4+AnIlMgnQRVR/Y7gvyN6c1NgbDSxPLHGCZcM35Nm4rZgWk1eV98y\nxxXc\r\n=gmUk\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n","gitHead":"e3af49aa6adf883fae47818d94ca4bf608765bc2","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"23.6.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollos-project/ui-kit":"*","@apollosproject/storybook":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.7-alpha.19_1559075067708_0.4540220676992619","host":"s3://npm-registry-packages"}},"0.8.7-alpha.23":{"name":"@apollosproject/ui-onboarding","version":"0.8.7-alpha.23","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.7-alpha.23","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"a3cbbde26301434d51d1596fd1b3ba5bb973187f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.7-alpha.23.tgz","fileCount":66,"integrity":"sha512-3jiIE9RKZWPPQyPPkyqBMD1E8OAtcRJcuVeNGBrIe26h31A7lOLnZ0/8pkfGNtWb60fgafnjSIE9h+Z+1BvBvQ==","signatures":[{"sig":"MEQCIC55bvFkmXOLaYMYGcY+wZp6r/JhZhHukV3itdxitMhJAiA8VTL7nAepcckHVhfcLRdLRfmOZFEYF19fKVBwTN9PTw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":660645,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc7+kPCRA9TVsSAnZWagAA6QoQAIy3GRmiictKSY3d3pKw\n7nfVZg3IKnkmFUgEykgRmotnUGVCpPkRg3QbeO050/9g4ZMU1Duq8yKJZd28\nNXkOykT7eLTgycVCUW+OxCCQ2sqKgNTroxAchRBi3RaqREPRoSr9TRtdX/OJ\n0kdY50OntR6vuPYu1+Z7KL2/C5n4A2LrXAJvLndn4nIKnomffKZGPFzpKruq\nlH3oKJ1x6BRGJYrtB5RdN8Q9BYZwnjaG3XeQlIqxdRXJ+gmtfr2j/0rGhMs5\nWsMk0CVf3e3tvioOg7Rpr9bBsSwgOTgJ/1I5SuWHopAAS6uk6w8LGuo5S9zq\nEcttXBmiDqTgedl105T8GgYZxdsQh7NOuF0exta9f4yw3FhDfqeik0oRgI6v\nVByb4RhUasiLSmvdpfT7bIWKMxcjWmtlBrDH/jCN27rp6DwxXwEzR+JkYaas\nTmJNMDbfWSs2NUDhZR+AmQ4YhBnQFt3DfJRXD7Xc6FpiDS3he7ILlan2T0gB\n8zuljyAsUkroaNvDl+GsOG4ScUv0awxymUiXUb/82kswVtdJXVwg5ddkeQnH\n5I7Se9vxghDvQrPK++laouv7QQmQmBcbEN5y7L834TTXnt6cTOVkZh6Ru2FD\nGxiHuuDNAPT3jNiBkEiXU4Q3DbLEV2iVadOoNsfeUdpNki12MkhQuBYDsoaV\nlwxw\r\n=CFUD\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n","gitHead":"318ffbcc8993cffe747f7e4f6abfcfaa87c09de4","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollos-project/ui-kit":"*","@apollosproject/storybook":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.7-alpha.23_1559226638766_0.5610262755015227","host":"s3://npm-registry-packages"}},"0.8.7-alpha.26":{"name":"@apollosproject/ui-onboarding","version":"0.8.7-alpha.26","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.7-alpha.26","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"6109015a2f1908fc3bb993c87880bfb0b3742e8d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.7-alpha.26.tgz","fileCount":66,"integrity":"sha512-DjOkM+d4VDVyVAMXL1DhTIyVfBEIKoCS0We9M9tTABv36ia5j4150RQgfWssqJotKuR5a6p93ryj/8w4r+qGzg==","signatures":[{"sig":"MEUCICrqRT+s3h9g+Y+MJGx1JoxMO3vANwOtiPbNgv0j2cv7AiEAucVdZbco+GJDEk7WcgmJJ40FOZ1chF7RUPNd8V9E2tk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":663213,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc8VxuCRA9TVsSAnZWagAA+dQP/3UKnJh8H3clSagfAPji\nBmS2H3QVz8OjAvpYwv4pQRcF0oXL63QLztb2kyY83k76ZJnMHE9NFssGG882\nroL30rp4wRv8XHXZP8bvvrGze1LBzmyOOy4JmYbCxf4p6yrFcqCj3maAvZj5\njO+yVLQSoLQgGsZYUPxwz3sQmK2ar/yfYk8jz90ItAECdH+e/b02r4KDlAfZ\nYVwDWlNgOC6UFX1cSYa/Y21wUs+FlfmetvxnmskaaIZrehqGzxN9hXdysirE\nMHArfHR5/rPkzctEX8F430mPwO8ZKt4fixFSMbqXBO3JmnWTVsu0IPUllqFH\ntLcD8DARndD6x7LfICMdH6i3ic74B4df0Z9mgKWwuB6DVigSvOfE9f/7tGj0\nDg4gCyXPpdwh0q7cmL/kVMLGgO6yKYyjc1udg57VbY0Pi/M2alMFr0BeoD3m\nlzyc+mS657+zqhKc7ciStnxWSlfGfDmhkGe8QE6Iq1Ao20p9PJT9dOCq/H5p\nreXxZQneXvgVvzVD0dfEQKXWRK+DTY9DszIETprJ0jVbE+JSQYqQMADVApBg\n55TPq+KHhD2FP3VLxprgNbWYCk4C/N2CEnTsbM3RVOXM+2LAhYsWd4C9zwzF\nBoemLtdZjZ6YuqFBQMV4FxgceJ+0Tw9NvC9eKsXq4o/kWj5nuHers44KUthH\n3FhE\r\n=pUBt\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"44f71f4d337117661b27e1b1d7a86a8cfaf1c62e","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.7-alpha.26_1559321710126_0.4210371518178442","host":"s3://npm-registry-packages"}},"0.8.7":{"name":"@apollosproject/ui-onboarding","version":"0.8.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.7","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"e4a1a7216f929de0c9e0f4e605fbed64ff801a2c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.7.tgz","fileCount":66,"integrity":"sha512-8HpI+t76clcc9IVjjLtsWx9uNm8VVO+sMh+3rG6C9mU8XIh0XfuEszS2lI64UzISV7lPlN9dOdKqbunOvN0ZaQ==","signatures":[{"sig":"MEUCIHuWSL1ovqaBghdvxHKPfT2PgX5EWMXFq3Mlpbk+XJlWAiEAp62zyfRfNtod6Dbo0iXhOJUpfFT/WKPPwK4JVfhT1lo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":663196,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc9qjWCRA9TVsSAnZWagAAq2MQAIgtTcDlO5iaq3D9z89k\nAtAyIjmZSkAerJhnFVw91DC8J6V+WVw7SS/wFLYR0ro3MgxBQEzrzn2Pc2XI\nrZI4mtPUVViN6yP1roNJhgfIjrAKUwr+houjq6RBmPpDjgVHUONEyQPjWSg5\nH3pNawBr4D4YdT5ZYA9oaq/kYLNETaW8YcnrSO7eHSOtZj47cGOeM+/PHpJ8\n9ZaWUJcAGkiKwsY2nj9UvxI+l4wJuEKQmon2MXi/IhGl4gXqSsuhODE/kfow\nYKsawJF/bB6feuUArp0MQs9sREpZcpUhpUCX133dqyb/dFrNyk/XM3LDGf9g\n85r8889CXjysX1ViAoKBGQrCjbS/KvwVHRB+83YTlQvfVGswr8yPZRggyMTP\nCsV+GQkXBLNpR+RQWhHS8o8KX8Se4+0qY0RbU4HSkrLDTIOm/bGUScxmws08\nAj4XU0nJ4NRtE6ePr1m5aXtWlANwwBxTqA+PFRs2/UqnQaQoB+nPk1bxmdpx\nMTCg5B30JYPfK3CsFwNz4/ZIzXM/ZBjA1dU2Pcl2v2P1d+u8jXObX90xXrgd\nhj8xe1WAvZd0uIxywIKEGy2oCB73lI7mUBmT3GTS6y+e0BfMdtwuBuq93Iav\n9WCjbbbm1rKk/vY8LLzOHGPF/cPzLzET+zgh/d6ItIG0G4v1wVRF5fqGyOsr\nor02\r\n=syFV\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"d4aa23147e36e06a13e9667835128abbbf2042e8","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.13.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.13.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.7_1559668949523_0.9314212022911674","host":"s3://npm-registry-packages"}},"0.8.7-alpha.32":{"name":"@apollosproject/ui-onboarding","version":"0.8.7-alpha.32","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.7-alpha.32","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"fa32b708dda910b5569336ff1a698c69a126c958","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.7-alpha.32.tgz","fileCount":66,"integrity":"sha512-IQrNZBZsGwi6ylG+IAGWyJ0ETCj7nED7Nops/OGnjkx+jDTlF+F5s1YW7eCePzEiD2Umkh3lNXtFLV9VDQJIaA==","signatures":[{"sig":"MEUCIQDd8o5543Gy+RAi/c9qB5i2+3ezEheTzw5hvOF+PC78lwIgI+LzqaVi9IlF7B5L9UhBbQ15jfuQDvc7ImVIzEZnx7Y=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":663213,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc9rY6CRA9TVsSAnZWagAAVz0P/14tF21eD0nS9GHjLt2r\nwlkt0ShK4MT0hnwHKKPA2GXMV3Duui46nj9CXUUg/QxNpepquRl2LrNBP4LG\nH6KZJ5PMiOyjvN9Z9TnZ2zv9ad2CZaoDqaayHCdjHXvlRTooWPYIRj605WD0\nIx7WfmuqxzRiNa5S1kcL1KNAkbKhCgrNTmCHQpFOIAbFtsat2Mj9zD+6CokW\nkrRsJN36LO+iqgJs+J8JAk5+Ur+YEZRNQfijWHw5CSNs2kRGWUFi+r2iu8Wm\nnCWW5xKtsZpbH6mDvVsyC8rwo5dNzoF9K1dqtI8FyE5aC/kjFG9KkyMM2Wo7\nIHbvWNomoU9n8/8e7IIMljdHvJHU3srzKl2RVL5zzOONffRDXvgA7SwRSyxP\nVYLDOyIokca/ru2y8I+1Q5Veroh/HDQ1cJNEb5lCP8UQNCNsFu9nncxRQE8B\nO336cRKqveJgxD+LBGHgbY68/85R42cx2sWblxI08TjU7bTrOs1eFv5y289R\naQUjO+qrl62iDwprB91fEQUYvDmcfKWPWm3dV0xwfJJ6ZdeOABDxKf4TYYHK\nqkUMSqIQfyKeUDItw51TD8LGxlI0lkw4rOD60e2HXhoUhZbffRusxnKoHSDW\n2HQKO3yggpVK7hQY0QqaKHI3YQoKhhllDDWpMHVOk50DbhKIJhJ0z4LuqmxC\npNJU\r\n=o1FQ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"3d65480e5d448a2fea5e41761c590f02bfbd6bb5","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.7-alpha.32_1559672378250_0.15676656757023077","host":"s3://npm-registry-packages"}},"1.0.0-beta.0":{"name":"@apollosproject/ui-onboarding","version":"1.0.0-beta.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.0.0-beta.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"f99415fac327ac03e84c244c4dff534e31b9c781","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.0.0-beta.0.tgz","fileCount":66,"integrity":"sha512-ge/bXoiRxyIg4rAsTG1RqinHhHjBl2C7m6r4emqHPgTSRh8cy04NxhCQK9EBFTfb/pb2WLuc2ekjRuYjML5mPw==","signatures":[{"sig":"MEYCIQDfjeTUvnsULiqO4Um5NuVH0EboibvJK5W7AlXA47WpzQIhANTXTuYqYqM5EefhlK8XkdLWS0EVqlgSii69OD7/2MT8","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":663203,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc+qkOCRA9TVsSAnZWagAAkBYP/RHEcI1pLeJPAq2JgftR\naOu8uAZm7rpxGhO8YBWH3pMW9PBL0ptjKqwpweuHobMGNG4J5enmF+63Cj7K\nWNboaBlIvt8bEbUfjIWwOW7MMPu+iXL5xPjB+8ANPH6wHg735j21hcQnqY1K\n6+M7IMpIAME12vH9j4qLK+2DlGz16VmqAPqI7Q+9jR1BbGUp7B5E2ELJDWO9\n0Ql/skfHr6k4HVL8/yIlnej7U5t68tl1j/O6aIZP01bXfUqTQGz8SYpzu3CU\nGx/EQTm/CtbBj4lBYt86CZx+1vylYMqAFiM5vWwI7Xli1Kmbqs1ZPVcv1FXR\nD3M/bmJuLkxDH+zuAW0wcVGoPpO5Y7ut2PAxfMV2X7Fg5OCNP6lhXwGKQkc+\nUJKP/OFUk4LPKAMAKrfr8MyduEcSlrBBe/LbvnjjiHPxFGXyBlzk8q1pE1o7\nyZ3P+aj9Pxv8Efr6EERAEwcnUeNk7YXR+Rk2bye0Y7Fbvo0GRbQ+HDRIWKLb\np0EIVgoeu83OMQRY85AmiL/KM8E+V458Lef03SitRqrf/ow37/FliknL619m\naGqz37sT/iAaA/pF3ic7NupKfmizLnIpwBVE4VAMHJx0TQQZf9OwFPO4Y+Tf\nrsJiQ4SqrfovbMkMTJwUJM8GHZ+omnCsKaj7oP6JXLRsYPdqnepwMRatVtwv\nPXC8\r\n=BPLN\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"e6fc007ace19751f8696e2554df3ad2df06d89fe","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.13.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.13.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.0.0-beta.0_1559931149919_0.5836149194225668","host":"s3://npm-registry-packages"}},"0.8.7-alpha.35":{"name":"@apollosproject/ui-onboarding","version":"0.8.7-alpha.35","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@0.8.7-alpha.35","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"03f1d8b4dfdd3fbc2361f360bc1de7a58341419c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-0.8.7-alpha.35.tgz","fileCount":66,"integrity":"sha512-tzDDd7Zkq/U1UR63022/PcvhsRmteijBJenkX7lM1iWgwxyUrjXFk/9nngRrF8usIyFTUKc2Fpv6SpzXhcFbUA==","signatures":[{"sig":"MEUCIQDV9KdYUbMDLemlHJaw77sVQng3ze2FeQcuhT5VfYEfEgIgTWEzcZAasckiPv+9Zw3RN8ciWy8MeTU6XFokZbFf7O8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":663213,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc+sOFCRA9TVsSAnZWagAAi/UQAITHN6VfDr5kZlOdTLa/\nMraGyIEi/1N+JYC516PAxuASjuXjHlzGmyLGPUdQVU0jIU4IuGBUmSklAnt3\nC31Fas6zjFUF8GMcnkPaYs/lxhymYrrOI9TDc1k4iTGuFSEYJbinQwjrED+6\nadaBdySuMJ6aDpkvdKI5uJw82OSEzOLnfyzXAUMbA1NBBSGuN5TxQPR3m/PR\n8Y0vsAreyxrDwldLoCdPP6q77W1z+8Xs8LRlU43YIxUzUykdAlCwXiPS8NQa\nbUkfWhqGUsDoJD5QP6jYTWEk4Kn3WlBQcjqMNnkNCMTSYt4cKri7VH/6OAAQ\nqFcQCKil3P3uj2sODafvV/LRNRhmko4Q+jIbmmH/xjDMFwMy/CN1Qoz/IIht\nyiyPiYAoerjMnPygHAhMmVcb5hh5fSK20fSFLKcreEmWhI76ebt8SoXpFnO+\nZ9ryEtkaSiGVJcA0ibe8Y/WFX17DDHioiFk5jVr4KeR4Rb/q+svFmFVBcODE\ne+g2yONcp+SspFiakMrPa50mQq+Wtqs40M5rIBvr+zhD8k5Jy0iAs0QqCvAE\nNhawd0a2bx2lJqTxXm3et7Ax6eeXXGcuoEJqez7NOnCNOnu63UMo1sw73WUz\n8U//dblnlsug2GwM+7qvYhKEQ6RaX0hSPNgsSOXtwXg/CBw9Znq16nVVYbao\n/5fx\r\n=D5lQ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"4f1080c98fe8604c898c83979e1561c6a05d9830","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_0.8.7-alpha.35_1559937924792_0.63455833036493","host":"s3://npm-registry-packages"}},"1.0.0-alpha.0":{"name":"@apollosproject/ui-onboarding","version":"1.0.0-alpha.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.0.0-alpha.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"f326e685965bb41f0ba02c6a8ca0589cb5160cf2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.0.0-alpha.0.tgz","fileCount":66,"integrity":"sha512-cIfT0xA3eDD2sM9DcY1hbifcrEywgCQrQHK3OiHQMWTavROIJ9npkH5ptSQIb117JzWi9nsmjFKw1xLiOR0m0w==","signatures":[{"sig":"MEYCIQC91CC2QrCfNBwFcOjzIoevRqfJjHaVW/SpWqqR5IhCzgIhAPT+PtfAaQmloZSa6Wstg1qe3Sir5MAX4G+nC3U3ZtnD","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":678234,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdAkc7CRA9TVsSAnZWagAAjdsP/iTVgrn8z4eQn3UEOeem\nuJL9KJAmxZJ1vIm3jdfVZRCQnpm1+YkzR2JcXQ/2WZNVaHm0n6kGwHAue5RJ\n5mo+4lhdPjLf1kFpYaGFWFBCLjzyH+hNOS05SBJuSnSw6ctYRy+A9ccDL7hy\nz8+/Q0a1IfTp867RBWdTfkUtbQ3YALJQXJC1EbH8k8UkRp+pVQjhQvFX4Tcy\nJa+bzx7z1jY8SLH6xtULWkD8gvSfErgqNe5s+ujtXNTfrj5tEqp6WLbtrTOQ\nbhjuge230PjAjtCGS5aTbUcs5Ms8MK2derLdO4vI/mci5jelSPH9iENpDMkN\n3Str1Xp2WeWjURQ/T6La1Mf9QrwvozUiqjTV/39lC3W7bJiyt2LFljQKHnal\nDMK+aOJbgd1GY3lYLMjZvxvJTKTK8GM9o1z/oXzftRObPWyj7Yc+QcVQ+s7D\nIdUQVzoAZCHpp6FK+B/x/larQfhaMIfMUmHO/cZpli6KCV8ztkaPL4eoPLQ6\nje6kI5JHiZA8gMVBN2dGegBoQxpgI1nHOC5DbxY6EGS100enCFvmXW4lSq9Z\npuqzemI4UdAqSzl/1hnm72bw8HUrdoDkRnEBo5GdOunJkZBr7YC+LotNeAJN\nFK8NMrKDn6gcmM+T4Htcfy7hSKVaK+kGnt0O+iIZLkLkqrAG4vfgEP8nqs3H\nTbpz\r\n=Mx9B\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"5e24467b7fba321275aadd44bd84c957573bd1b2","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.0.0-alpha.0_1560430394748_0.6870634135151319","host":"s3://npm-registry-packages"}},"1.0.0-alpha.3":{"name":"@apollosproject/ui-onboarding","version":"1.0.0-alpha.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.0.0-alpha.3","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"5412cc0173e86cec1a8ecbcc77b1fad48a7f616e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.0.0-alpha.3.tgz","fileCount":65,"integrity":"sha512-dX2NEJaptINbnsg67Isucsp6Ib49G7XryZNOI64oqHV+kQToUAWD62hsQ3a67kcMOz3CbBHwarzkhotIyvbIYQ==","signatures":[{"sig":"MEYCIQCLXZjxY6BGzQre/afK4bL2LNdsYB65VE8U0JFr78mSHgIhALnu/Ogl/1EX3ggoNXCIyw2Cv2LufS/EMoNxbxJQ6dLk","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":678248,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdB6P9CRA9TVsSAnZWagAA5ZkP/i+8QVYVK/edoen036Mi\nFgknAnbVXXHq/sCclqU4zmOjaBLvQvLuL6Af1EoMqSuLX+Pjh6arTDO5A/vi\nc29QSCzqbWAR+rECBA5jCioaalJU9BQBswLJpPAFEa9wWJ6bB3mElHYC6GCz\nHX1EJbql4VuvsLSUCWZr10QKyfCvhRyYz5HtooYNILrQW+h6rq6qOOtcXecY\nV8YeUDyHdIqupFvazuvSsQs9gX5iXs6zhI8wjZRYhGmWF8JE9JTpW/BGFiaX\n95qC9TxfGHvjgCcjSxcNFSq7xJn6uskpllbiIw9Yal91Si3XSZtjpJwoj82/\nlzp+Lanras6Yk89OVcCnFP68VBzFJO+lPTDJBVFJ1jTw4tzFe3WfAr7eb7Lu\nyKYlHIQWXelwx70hODss4MNsP6JV5ANl+HRJVwgEKJnfzKrQvjXqYWwZ/q+C\n1D/sTEauOcCeYRlKx1ULkn2XQhEQehSwrjWSp/8cxPIJV1gkgqF8JOHEwk4v\n3FBDNPJHP8D1iwT1rMu4tdZiqk74VXU07Qxp1pc4w9AhzsgZYLZlOyEK0Xno\nLH2YUDS/jmproqhInMiF4wcjdaOcLLhQZgLTPfL4Mkny+I2s7L6hIScEF+v6\nYV+8f+AP/ZTmWDeZZOMhQoojppfnRVeOkjqRXEhQVjBG6oXeM0RCOC/XX1Ky\nabIf\r\n=OBb+\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"d2409f726a1319c550c6f91495dadddbe558b0ff","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.0.0-alpha.3_1560781821068_0.411882386388579","host":"s3://npm-registry-packages"}},"1.0.0-alpha.16":{"name":"@apollosproject/ui-onboarding","version":"1.0.0-alpha.16","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.0.0-alpha.16","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"984afd68cee97cb045635c01642f597de6cbe0ea","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.0.0-alpha.16.tgz","fileCount":65,"integrity":"sha512-GbOUeNOhvbAnmypzZD/G3VzJPVTnTNhpg+uPo1nKZS0ftIrCZfz+TSF5540S4h/VvZprvuc5Mu6kcEXbH4XZCQ==","signatures":[{"sig":"MEUCIQDE1mDIparlyMX5kW7Rx9vNqzFmiI/wwh7U63GqMKoOOgIgEz7q/ivX6fXuGu3ny7wgPJcGspxt7bPwgX8py7ZdCXA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":677151,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdE5t7CRA9TVsSAnZWagAAXQcP/3MTd31CtwSPoJwAh6b3\neER2GZAonwiC8BkUbIxUvgI9vwAnw/AjdKpwg+gVQCHO1J+mr94p9rzGg1F5\nun6YMtTO6P2zzsT71AYRV+vPTHPp6EvnNoeUC/4SygxbwU/oZVFDWVcRe+5F\nayHJ9YyPpFG6C3obfgTGmBng8XYHezVOHsuJqHOxPlKb8PuZoGAcqR84sbxS\nEBHIAYS7AE5BcWaJR1odp8vzo/ecyjkPoLex0mITZDYCkFIeuuLijCNWIJ7D\nEn+OxWfzPeCJRE6i2IEjp4POAQXdM6IC26aciyALnsPWrmrE58rJUr5d91VD\ny8+33QCsLar8/NMI0hlgGbpt5cVrM4CCsyWOYeb6eA3hsLVfnwzALbceElZF\nmeOzodCfzuppYo8pbwEo0tJWctX1bgrTtPnqtiqjPDYMR6hy/dEXNYZdQlKi\nympnIiyoxUlATbU0Loe6XtL6YuVelvi2R21YK97miIRu68uobKkW8/kj593/\nzPF9LZk99CqYHtYx5UfJ1PV741yj3UqldoF+BAjFB9FZKBWqSpSo7BQnyjVD\ngdsSWHkbDPIKgp1g/eHm4WMg6msUE0Kzvj7J3WbZse2vkZQW6p+T05s2eMIZ\nn8eOB1JVuK2kvtJOxmWY0b198USfqfJSjjefhhCfCWt8p364fVoFY8Ydqcs0\nlycm\r\n=4VTQ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"67a6e6a3733d3eb4b415ba86b870260f94073e85","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.0.0-alpha.16_1561566074457_0.016455504323201087","host":"s3://npm-registry-packages"}},"1.0.0":{"name":"@apollosproject/ui-onboarding","version":"1.0.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.0.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"eb61aa52f9467c67fc427a83c8f95d6e2b5c6040","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.0.0.tgz","fileCount":66,"integrity":"sha512-EWBDl3oBd7E2drnfgiFwkvLyshP0qho9vw8EfsECbaE2hJWMxnTdyeo2ucx0CD+pqwuxzSyyg1nLignTOfZIWw==","signatures":[{"sig":"MEUCIQDrUyqL7MQSDEyn4bCmmkKs3PL647coDnRxc1S3KMtBXQIgcj5ujnP+DqY0Ync5j2Pvh8Ixf/CWV76juq/c8S1O90g=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":683282,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdFW/MCRA9TVsSAnZWagAA3bQP/3+T+ywNLKEDdbIMViaq\nPk3vx2mVO13hKeKkn2yBF/UFhQXEiB41GeOMsl6wZaDe3vBN0N1/2CyqMxYA\ndSucl3RcoIOeI2/8iXehgQZuLzazY0cayR2TvHGODBnFPOgBlHZhAaGWATWe\nYoiDCk+ROv0dloZyzxK3D/JymVHBVpaDXpqi5/+qODF37TWH/c1hewDx0sfz\nFqLERGSiZ8gGP/CJbXd88YH9SyN3d5khglSd7zuRML/NFSbBUk65eGnqlvGI\nN5vFj/+Gcm2/EITjjMKJsamWNYGl0/1W3Hr/JHwc1mQXBG1RuaOMnWtfawX4\n6lRMZrxQhmq6QUzXFtm717W0bD9E42DdevFtXevbmaIizAjudXGTPr8Mlkjj\nbYcprihaND2whUsEPzmNbX/DmYblFFv7lx0SM3Q+Y2clpllUvvTQvI4WZv+O\nx4MrdFkgBCjiqGBH56BjmAorswAD1/ZJmBjKR87AT421YlegvVXoqOzJ8vFN\nsBmabmxv4IVnVGewbgqhyCfGkqz20MbWLe+ONMhdZ8n6ikBxJMX8XpsrCZgn\njB3V8HtbLaoicYzfSuhNJm8ftz0IxO8ZFvihlWK+KWjk9wLMALZ0fbp4f0Lb\n9bGqnkydnzyWpajMZfKxsMP5xbwed+D6GAOa2wXG+O9zcsKz9S/c5EMOIMII\nP2tm\r\n=PamX\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"a0c71fe1d1218725f19654d2d877f7dc988a6985","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.13.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.13.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.0.0_1561685963874_0.8864708380442134","host":"s3://npm-registry-packages"}},"1.0.1-alpha.4":{"name":"@apollosproject/ui-onboarding","version":"1.0.1-alpha.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.0.1-alpha.4","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"79f49e2db756aa9db4a83fe5b4005ad44781a710","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.0.1-alpha.4.tgz","fileCount":65,"integrity":"sha512-4If/uz2q2C5fGEvzY4MnIEquUxBlTHKJyqXnwZUyNLcYFkdPzB4JCWCVRM9gw2rTeatXzCvtXrZ7+hN6K0oU2w==","signatures":[{"sig":"MEUCIQCvYHWUfLuLYgJ2OS/DuiJOFZSSbGcy5708TsQ6SJ2EDAIgJstAwrp8AmZw73ook5W4o99oEmPRcShPaMJc6iJTUF8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":676654,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdG7BSCRA9TVsSAnZWagAA9acP/R/h5brWRKoQBXg9Qz1A\nn5Sx2VfAs+QT1jPRMI2heA1IoXyum0Mo0RRKllGrIorFjqo/avHTWtW3c4rr\nHbHjnQduw3Xu+bs5nGe/m59axsvNydL8MPasiG7HQw/LDyj+JQAr3szRZj8p\nSclfyPb2y+cSsq52nzYVaCN5JhFN7YN61SikK2AX7cz3h6SynYnMII4XTqqP\nCMpYnKe0eWgEgBobvk3wVajMgK4e7XqtE2NtwoXZaxhVOj6jgIuVvUr45hFR\n/4K3M2RprI/fii0ljBvNBINED3frKJzS0g7fo5DkZNgxfjF2C0SLarcwmmv0\n8MGSOHyB/NXBC13UdG9dWAPzpEng59AAw5SEzMsCow1eyCrnwDmwveOkcFVj\nhmZm2jOpL7JTRHSfGDFjyfsJbzFccBkC2Kt+H9iX22lCokStqSAVuA8IojmJ\nimxV7FiNIJ6Mq4QVTa4X+4jYoAZDCkT24BEEdrXery0Xf/UN8HVRA9kMhmm5\ny3TmZMR+c20zQEpal4XChVAgDqsJ6Dh2LkbwLV5U0q/R4o7+WUoFqpOrn+lX\nboclF1Ya2twT6uBl6sWbZSMD5uVlgXxOTqr3Z1dYZshgrcUmh7Cqzw4Rwi16\naW0jY7WW071t8k3qJb3I67a9R59XHCwZG5//urI8trSlC0sezC07DWJVCD31\nrtDa\r\n=LlfZ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"1ee755ba3b9df317256653536222d185867ff724","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.11","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.0.1-alpha.4_1562095697669_0.2537821240569822","host":"s3://npm-registry-packages"}},"1.0.1-alpha.16":{"name":"@apollosproject/ui-onboarding","version":"1.0.1-alpha.16","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.0.1-alpha.16","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"7f04c9f2ac03d2ccd81346956b37c04645aa7c9b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.0.1-alpha.16.tgz","fileCount":65,"integrity":"sha512-p22mIw5t/zCC2rggumZE8j4/1r5tMbB0Zqmny1oyovA0tTIx102evjOw5dpd54FkPxGrHJ7F8xDKRgFHnZPSeQ==","signatures":[{"sig":"MEUCIQC4LCIadSplRVb7uIt4f9ytH1y4/bHhcdfNI4AgGwm8KwIgdo/f9hTUQ7O6/ciTuLrgPGJf9lCSqy5/S9OAZpR9d9Q=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":676655,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdKi0jCRA9TVsSAnZWagAAUWAP/0lzMCnQza7OZFc1vIJ7\n7G+SmXAib5J7ro4ec/zyCxJ6hGsjPucqK/dXhI/DmLHpydIQrKHMNFEEewlm\nldxcje5fKwKwm1/i7doNdnPPirkigQ26uhaYoIX32yLc8ibN2J++91iHLByy\n5rM9TFiMYQCfi4cwngTcHaHPgD5al5IZnbkoeIHGasqxcfFaIpC93TJzGBTX\nnjn4i9suooPOJ5R+nWRguIClxfdPvpkbQ24huFztO822ssOuHJO18f4e5ihG\nz74O8heRfvPk9R/dD1lmqlpfmtSgnPRAJPyZp2bht/sf2HdcgskZcxHh/DMj\ngrmc6HaPfK3QYlGDsx8BhVPH1q/0xcoF3OIRG5lmEMN+GcUSSOi/ct4MBonv\ncZ1g6PNh7x/wR0wLVSD2IeMUjU2l0s3N4fwwM/apQoZXZ+YB8viOXz6MbHT/\nGrPQk+cMNlDmgd1CA31kQ78h6HH4b7/+WTcsw9AtQwhvGMpg7/mSYEMTd7iD\nseP8txBNxGRRPzUXC8WpNzxdYrS49bErJqzX0ihZ6REUb8gpBjlPXu5Wo5ja\nKF468YBYa+uyijwjIKL5EPpM0JNrT8v7jpZbdV/qKOQgbrOOOaI4ATqXhp7B\nhKaPHmQ0gew8UacpFJaSWN7k7JxEmy6LUaipOaQ9kDKqrJA5yo6+yxiu/spv\naIMQ\r\n=KqYa\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"93c721fab33419d0e4a769b7341e7a2076f426cc","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.0.1-alpha.16_1563045154633_0.4253262040664727","host":"s3://npm-registry-packages"}},"1.0.1-1.1.0-beta.0.0":{"name":"@apollosproject/ui-onboarding","version":"1.0.1-1.1.0-beta.0.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.0.1-1.1.0-beta.0.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"984c3036a5b6c775d304320571009803846e1682","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.0.1-1.1.0-beta.0.0.tgz","fileCount":66,"integrity":"sha512-UCDvicJAA0aNUvSolQm9O5BVbkn64f08RU7LxC5D5y2+dOz+OWf0UnH+h5yW2+0key7vQGSaLxS0GzofSCCZ+Q==","signatures":[{"sig":"MEYCIQClKtV+I7bZGdj2AIzq0uViNVMFPXxi5bsJ7pLlX69e9gIhAJ61mdaN6qAaa8UYhWhF8tHGv8EA5yCrFE7Fx4ZLwcfm","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":682801,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdLhKoCRA9TVsSAnZWagAAft4P/iIr8gmlXIUgmGo4xb15\npYeL5Ni3Fm2zFW5NtvWwT21fLUep22oZW7hGkYRdUczmYhI/1XgeJUAkhqx1\ncj2Nthl6ZiUFhNrc5qcXK/SEsXjWWvMD0bTQgtBupcYAxeFjWth62iJoJEPz\n0zBfzRsFppW3608Xk7qh4wEUSEj3/NNh7cXLiEP7Aztsa/tQgB9NumdJDc0z\nrnkOO5a+jRS7ATC31IeRdDTwFwMN3/yLnrhoVzr2ZxE9ZSMRGI30IGTU8exN\nU9FGNPn5BUN7z7TQ0JZkLmGBB+x/nHF+6Na6BtJaG+7WOmpjfjvnW8G8ffeC\nnRqQqlZzWDAViNAYUj0vVKmVRJ61KrOmOpvNh2qs5yWnUNqGO47BffeWo5yI\nHKRuxMh+JM2CzyBP+dPm0ZwyJevHBvdY6mGyVNbCCZPlIPtVHEaF7PQ0Etzf\nTOXC4eEcatjqbRLNdvKN36JTSPJx2npAZNfjh8tz8JMWdgyqjcMX6GuvfXAs\nqMZaFZ51TX2g09WF+QRd3kz+Xn2k3oK8dau0gB45GiXMmoV+g5bHizK4WlcT\nQQ2CT0XMStRira1ApLiw+HdFV/WdsIrNHXy/CvGrzD33IHonaDfvXbwrQC0M\nzQa2rcdFJdaLQ+Oo7DqMFin/FDlV4pdUkkj5hHLVGvZmXLjA8DbuiNWEwJOI\n5jdl\r\n=6Iuu\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"8e3f11fe42299602f3b25f5791b0d83314177d35","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.0.1-1.1.0-beta.0.0_1563300519865_0.6192566962361001","host":"s3://npm-registry-packages"}},"1.1.0-beta.0":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-beta.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-beta.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"a4c57e6c8b283f932466e06c95cfad9d9d946d86","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-beta.0.tgz","fileCount":66,"integrity":"sha512-LWlk5vdULhlUPp3EUzwB9uq9mdm8o+FAPnl3CfBIevdm1hn4CGioVKEl1njv08RygJi3bqy9YKnHWyggrxH4rQ==","signatures":[{"sig":"MEUCIQCwrmupKqgKSrx2XoUCcJ7KLFGZEMSQX5sYnpArTDHDTAIgZMnrAxw2vaHFAn61G++58cSVLY2N8Swkei22EyjlLnI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":682793,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdLhNwCRA9TVsSAnZWagAAID4P/izXV4fVnXjYdKX/7wZK\n9dCxeFbARnbq5CQo00d/X9LE9HiYK4PwVuTFQWAfCAiDaEJ6YX76vGjHH/WW\niCb1Ya2uRo31YfosmJChd37UJYBk+Ww3ehVhBqMy40ct8kbqo6s+NMHrLWJH\nQZjjUDohPZ2XenR1mi/MNstJ9whjC4umJcD73o7ibSaRJBPN/Wck7XOqu4b7\noBOfEb4ng16bFZzGNuQkQA6Ode63P40ku7XEGvBCCVAp8bLGX9Q3ttKL7ssq\nEcdRMO1J9UvkYfzllIQC+2lKEhXWJObY1CAZrCWkJXOeuFe2AA4EyGNxZQ+1\n8jr8M20hGX3iHObK4/vzzlHbHHhf668QDCk1R/ozU2O3jkvUWs4p4YKF1j51\nSQ00p09eulZpHDm1ii/OY3H6tdEvxL/ahD3faFEawja4VcDy+dNaC2PTHcAU\npnSUMK8gWBulWhOTEr1yukgN2XI+ummVHk7ncc8PUdDHpErLt6M6paTJKvHW\n3Yz9qW8obpEIzoXQ/hPeSqtLNxoKJEmPxGcoNsoSwu2Md0pQeFTSzVShd8Jo\nljf6qVx9maENmhpSdo0DFDPnLg9baqORJWeUljkbGzRVeYQGXGMQ5F3BiDw9\nBLGJiDpMsLJ7lM4FhmQKfmgxhj8Kt9IJchZeBLjHkgjV4nIfVXwkJ0uFrtgf\nIbJM\r\n=a7EU\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"bbeb5c282dadb4ac458078064e57f3f7ddd7a0ff","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-beta.0_1563300717378_0.2326513895172997","host":"s3://npm-registry-packages"}},"1.1.0-alpha.0":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-alpha.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-alpha.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"b0566a84c8d80fa0b9f8ad6bc0e70e6785f25d69","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-alpha.0.tgz","fileCount":65,"integrity":"sha512-+nfWSOpscs4x19Ts2njazDk6eOcVW7TaN8vkyGWEPdLDDVVdTsmQy7A/yP3EPNp5dfv1pm+Gld63pthf/DinxQ==","signatures":[{"sig":"MEUCIQCL08wrY1Ja6T2gKbbZRG5kD/pUUItQSjU067s339Z0ZAIgSj7qxY6/ovDV5ISB8AlpKNm0iTOUBBB0p4bdylrmd38=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":675323,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdLxXHCRA9TVsSAnZWagAAm1EQAIn0L6w1k0BBrFH66ESs\ntcF999E0rLubZuQZxIsFjq3iMaDY0BYdAUdacPPAEJPCkp5sw2JbEduFZz6y\nM14cXM+0efFPi9GYCKo4ZlqohOVJqoKLT/SZGahboPAF1fkqfyE07XL3F5wk\nVJHektMS53Wc4YTysgpA2E2FK8VR7CbNF48kO8w5CB4YJ+SIT9pKR68cNIFA\nzUqt+s378+hXu5xDT17YIl75mb/Td0hyyhzP3Y27LiqHENN2jiikMF9BraIb\nuqvQtLhn1y5Tx9bIYxyjH5el5i7C0q4BOHYglctWpsdAX+1kHV1VTdg6hTjN\ndRzVqViWl6htxiahdgjlYcO4huleKKa7fSFYAmke+j4QsRniiE5LdRNCxkcI\n9WiozIt/7BM2fJWOXHYF6XI2671HacQkJrqFOJo4cHDTZv1btE+TdV83sxAx\nu2AX28R5JOWfXZ7P1yiIFr3FgqSIitW5wI04fr38SqfV8Xt+dnnSi6dDcrMN\n7U/VQuWZSmDNWJ772+Cp2L0iGYVCAPHIsV34jrzVCIHRPu+5ygDoHJawAfO9\nbk/w9VsrdCkWn16lbIowpnX5JVZl52akIzEOYbSBEES68wkAYbHR0NdTIsML\nyA8mwQRO23EEZi6Y8srpze0a88Y1RFydHqHOrigCzBNJUVxXhNcj0BzvgW2V\n4oFW\r\n=Dk4/\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"40b3e3b809b4c967a7174a3319c0ad19dfcce3bb","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-alpha.0_1563366854856_0.5017652340915024","host":"s3://npm-registry-packages"}},"1.1.0-alpha.7":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-alpha.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-alpha.7","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"260cbe5415c40fe24cfbb67298bdd5b4d996934f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-alpha.7.tgz","fileCount":65,"integrity":"sha512-DxoQSD5ddbTm56FMYL2BsYABxKn21OiGTNoNR6HTTQNfYP8Fbz6KlFQ0OJQmhnMJLy1Q3GSdWQjW+eeD6CmhPQ==","signatures":[{"sig":"MEUCIBWEgGLQjh8AU2kIZ3yx5miVlu4ideLTqQ1VGFPVSbhcAiEAyEBvphVuwz/TeIbBauIF1DQS9JopSvffTb5bGqmdHOI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":675355,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdMcaKCRA9TVsSAnZWagAAtioP/Ahp0GRsB2LImiCTJS9R\n70uw2LQJK3khU15z9vwjXTTsdET+cZBOvAz5KelRLMuftXVvZGiWekpT5AcK\njyHRCqKLi7rS3+KEI/TMh1OIsRpxxShRzyY4Mk5EaGRe3kIU/se6czFFktHV\naWhTctqWA5O6wLHAoNxs8R8AxD8iiernMV9FIf69tvThI7/pY+r8/++q7XWa\nV7rCVPb5ZA4J1aLwUbbnRuHb2PqBh577Meud8WTWPzUdtVpOKcwcbp/gXicy\nqz3fklnsQDbP17M6SqIZfgdQIYUCMtH9IMcA8rImsZ0FR6hmQ3z4GLtPv8TT\niu4CN7xOTrnysZeHsYDp4Zzwfy/yYJfa2QQYe863N08iZe9Ed9OgCI6DDEWp\nTMhCJ0yMGvnmQ7g+P4rHk08Goqtg0Q9eMppuCZoNyHuLEYMhLv+d2RdK9P81\nAa/7+JQGF5E9Gp3qLhXjieXM4wp8PcaOGr/dfIUCXQx11CESmMW68ytzGBeE\n86IHa9x0/+cruo7A3FZ9WZQn/ujdSpUYNkgrVpZmAgl/cgXoIpYObkHCzj9P\nN49l3QuG5Z0w3PLIoIyWDNJhH9j86orfOimrbLFoBnlYhCV+YNhHq8d78ZaJ\nMB0yBDtqFpGjvPsdZk6wj7XQM3D5h4PUv5YlMnNHpsUeJfj/2Tbd9OUx9gIi\nAk3G\r\n=Vz/u\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"f0a0728c4a29394668291c7e5bad0e8ae59734d3","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-alpha.7_1563543178006_0.07200371447238108","host":"s3://npm-registry-packages"}},"1.1.0-alpha.14":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-alpha.14","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-alpha.14","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"16286e2cad44f1137362d65906f0e91a293c9839","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-alpha.14.tgz","fileCount":65,"integrity":"sha512-vFrKsU8HybIJ2z2POB+rejO/DujIZt89rVy2M8kcJRBTLZ9g+7xRLV6+/xNK3GMCbNmFHm6vN/wm1chvOT76YA==","signatures":[{"sig":"MEQCIC0y0o/ePeWRx0cl78vSedOEuBKG0k2kWqmnu9zF+d4cAiB5CNL2CXI3Y6L2S2yaQkzLrHarRUw/CDtSAoeu0ke4CQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":675310,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdOKAICRA9TVsSAnZWagAAMu4P/0Kie6SqE0+hlUrc7HMC\nDiQUcfbxd6UYyzj/1M4pOfz3wDyFbd1B2YCeNPic+acTaDKneJApdBhrJPxt\ncpLFNIMPvk1ZJdb2aNnnvFT2caxyp7mbHFzA7zzg9tAs6l3dvQdAEQ66dKJb\nDdtrYkwJaVtZeoz3KkVpspxCz1HoF6ezHqB0I5C3zq3kV2tT6CYqqrvvR4Hi\n7Js2FaSySFVt8WD8GN8bE/OgNAJTEPHll6wDJsxPqnKfHV0RRougMw+CVsze\nYrOshQScNV9sBYkaNTwsRbhO7JOoVhEpeQQVF6GvxJllYX+On+9UnDO5AGGQ\n5X1id0oPGnmj2W10yguBtiZ+sXIPLGpwO9UEvqQ6chlFZKeROKS8QMa8fSRq\ncLF5EpihPLq+aDBgtrv3q1vhqOkj7q37jhr3acUPIzavRXbL9x7ypVx5QGyB\nVR5rbqeUy8cQTWEBg7aZJUAPjhKNiV7geSrdTAmNZeRJHxRkv3zN9makWDZi\nx0j4UNUz4fRU7FTfzdRVZQe5zQA9hVwMTZbaukl42Chh30VUibILsAF3aOcZ\n/jw4BB2tZbR2zzFEaRBImBE2AIrUInPB66Zdn2/+hQS5YOx5r7gCPAttWFI0\n4r3redPoyQjgAXsm/pd6qALdYOEWRC+88GlsmZEF8lsFRCNN5+4fcsKPemmx\nLz84\r\n=dIMJ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"1e4260b88a1962097300b435274ed27a9ec1f78e","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.8","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-alpha.14_1563992072101_0.4325952026200153","host":"s3://npm-registry-packages"}},"1.1.0-alpha.19":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-alpha.19","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-alpha.19","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"9830183b04c447a850de012d9113107c1e333033","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-alpha.19.tgz","fileCount":65,"integrity":"sha512-U/A2LJrU3CVS5XIjesLI1D5+RWGMSR1uiJ5aYoVXSodR+uwke4dmEHJSNAxBjWzUP06mzNuA6a9s9GYX90IKgA==","signatures":[{"sig":"MEUCIQCMrfxQ4/Z+jB60rfW0Yl91bksAMoCK8a/0vEVRml6acgIgQX/1UXM9T58W6yoFANZzEAOJeykrMcf4LNQccZHvMoo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":675311,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdOegRCRA9TVsSAnZWagAARFYQAIjESqbt82N/HQOVYGyz\nvNQ7KYIySQ7MGqXRR+el8RZU1ZqeH+QzvVv3LTSk7pTh6WPZlj2VZAGEfRg4\nhOZ4/LJks2SHxTnv9nCu1TRtlJ8kikpRASjnaPVFUdeUoZCVN8a2WVTIdqoF\n0z0DrcpFqHGKRJYatd0SiCdqjJqRaGMUV9rtdJmiO/4b9fJ0R0PFlUDfpJLa\nlEXErYWWKKWcw/NLG5MOrg4l501m4mUr/yeIwlVY3Hm/Z6foLc6JhRlV09H1\n17ezJNopZA7/MLyobiTs/t9HLcruvAO0Rv7jSdkOLi7LOJuuXgDqdQ/aezbY\nvuzAtT7jS+VBnrPCM8SjPnwAMppF5I3smNjt6UuUjYSEpbTr7wKzED7XnAHO\nPPLYnIM8Lpi1rgW1tx/H1bFX+6IlscKgYzjBGLvzzkp8AKBBMA47MvSxUQai\nTVXNrH294tGW32gw8P1s3I6JjwMB0bhvYYJf0dOXKnnqlrQL9daljUV2R191\nhPUtMTmUu8/XO2b9wv148A7rwwkd/Ytp/HhqRP40XXodwfD0zIYt365ieLLK\nH5zprnVQHpdXOk0nO+jl1gEZFJXadiHSCUH8fqnaFFm+qNWyR+6AJvjiRI6i\nNyhvxnFXT7ANhQ6f+j4b7ApQuAC8Bml1EsxZfKKx1HTd0NXT+8WV49CtoXoR\nx5Em\r\n=4syS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"4acb5c834bafac34a485a6b6051c62eec9d2cd12","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.10","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-alpha.19_1564076048491_0.7108952585324979","host":"s3://npm-registry-packages"}},"1.1.0-beta.1":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-beta.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-beta.1","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"0b18a61557ea96d517d26208c11bd020fdaadfdc","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-beta.1.tgz","fileCount":66,"integrity":"sha512-1we3IUhfN8baQXRySHt1YeCE+9lqGqFssROdtoFSr8ulKwDl67X+caLj3ip5kB2O6sQQjaxEu6rx1Ncd9Knuow==","signatures":[{"sig":"MEUCIQCVAoQubRs31p5z97BP3xV3n8ohRXr95nMbF2QoTS3eNwIgI902VEayJqlBfF+I4n7MiQpiYhg33NSG4U4AeW2vnyI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":681449,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdPumYCRA9TVsSAnZWagAAjq0P/0iLhXqf8VTflVaYC6oH\nMlnskbsvP9W51TVCDJAbUVlzCV9oFNg9mbBGochKe7gsrv/Ghx4HUfAXrVpR\nVCUXD3y1CcUajlf3r2upfIMCDsFADUMFuI2MfW1B1VQB+vBx76LFFpmCHTAI\nrPdNx+C4KZwAPzDmnVywQkxpOLqdxlv+R0JAuJiI1zodM2LDKEIMyjX7b67I\njHR07IFhqYWTZv07rDFfyyh55WnAMOMMdzHUO88GhLQQYAN7GJDnZzh9301R\nbl5ZJsMe2JszB8DXZ1hJpm7qmgGHtpdZlTCqJf4SCXIkxjTCZxlVuN2fwoqw\nXJhhIhfKxYmFAq4Y8QOCGgiECTOP9BeDxGhc54EvPZRWDhefgnZ3p02oBeR/\nE1Ynny5DwJmML/u7CeT7hos39+SxcbvKgdlGzlOrICxZgn2K+IfdtaO1TtFB\nXeRslYL5J+mXTqgqhC5bzA62pdFDdZHWpUNjjkhExKleZh5qMorqJ1sMXKpM\nzIdwn67UCC0YjwhQykfdMBnwI66bxFPiaEpHOuZvJGyu/Q/aXEe7WBJUgZ1U\nkERVGU/GsD8CUIQ6CSzZwMjejL/FU4x/Lw+cg2E6c1UyBzrRyFTpGBOb/6E6\nIxnD+1l7e+XOLVzRVp1dcaMwdZG2oY9+5gZHPls7AFcl9LyycOMU7VIERZCD\nv+Tl\r\n=b3oQ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"362e1ebf12a797044eb1d620689ad3a0eae6b99d","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.10","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-beta.1_1564404120122_0.052817148054811636","host":"s3://npm-registry-packages"}},"1.1.0-alpha.24":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-alpha.24","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-alpha.24","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"445174d510b26059a40b120fc03eaf53d9a8040e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-alpha.24.tgz","fileCount":65,"integrity":"sha512-a/cYVqi6Q8c2BrKtu7g5qXoDBs3bOlpKiOce0gOZH0gaQaNI1ejDGGqhZDatWMoMRwPIKL86fHaDkqaEhPw+yg==","signatures":[{"sig":"MEQCIAi6zy/oG1aa6SjlrONL6AX0xzzazGIzx5+bxRs0wYSDAiAQIl8/iQP5RJaaRijlSFoCzQKDLlnf5V1H1KnRN0EYVA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":675311,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdPwBMCRA9TVsSAnZWagAAeVcP/iJOBAK3EosL/JgBjrxR\nqPZ8BXr0U6HUICtQoPpW7XJ6vETjxwPIleHOMgnAJwNsXgp5s3MQwRI2KVdA\n7kHO3y6BegAmquIhrjaQUpB3WT/V38fdzuuj+D9GZVv0EHQ6ARCKz1542cWA\nuMD8C5aaYmHIgD2FDGES2QizEitxu/T84Yswab5Rt4MEZJ5NZdbeGS+aO85f\n5gAV8DOx0LhyDOESj/5793IArDstb+GdeJN76N0RzCFB9lZ8ja3ydsTRRlvG\nJGq/yLtQmE/WAHjTMt6xD9xM7dH73MqQqNS/eUZdAYHODvNlHcdywDlhXy9w\nU6ZBwUSQHLycqvkYAJNZ6Bdczaa5ShjN7TEgrYpSiZ985RNqQPx5vx7haf7m\nxIVPJmW25wVH09C8XGAIipAgerNJUL/2/TEUQqj1uw3kHrspeqUuN8UDy/6z\n/fAXMnWeDeap5WMzXwMnjSui1YQuQWmnfNWgYT2FLrVlZuZrjhxJbChfz7pn\nGPVopMon75W3q3Xxf5p599KVH4b4xKVjLQEiO9YLpghyME/k/yXBWEYuzX+y\nZ1T5RJkaxkIkgBfBhnY39jaqh8xU3onzKw3rHKy0AABUylqc7CFugiCepIZK\nog4ncyyySW1K8qARFpxT6ZxmjUlrinbl9XLKxwkIZ5cbuHN1aNWyws5jg25u\n7Ido\r\n=iyzG\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"047683b50d52588d85d3314ae7705e69e769d499","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.10","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-alpha.24_1564409932038_0.6539118334872847","host":"s3://npm-registry-packages"}},"1.1.0-beta.2":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-beta.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-beta.2","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"0a05944f77eff02cf3a26b15a3951be5df30e41e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-beta.2.tgz","fileCount":66,"integrity":"sha512-ZZ01sBts/CNjEGPvbppQFxmb5XBtTJEWTea4lywW/olKvTk06jSEuicbtaseu/8UFMxeuGhtbk9OlE6OEnJLKw==","signatures":[{"sig":"MEUCIFu+iK1c2jpZGI8WxXFMaKVolHD0xk54OMROTF8AesrHAiEA6mEpH11ZA3caokw5hvm62W0dWVwSebK3BePYjxTijVk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":681694,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdPzvLCRA9TVsSAnZWagAAHWoP/jOqLwQwDCz/pmyEAak7\nccyKnLFEoGW6Vhfo62ScVeLdL41kQQSFzKulJC/OhxWcDuMNxd0NsLLo9JSL\n0o64IvedfbBXah2tkNrw8Ez3avTBI4xC96HXrOwAffX7i7YO4gGNUJhK0D+S\nf+XwrOFxRVBKT4tZr7AqBPpdCpmQxAt+Ki2qeZQ2NycGtGQ+d8aIhFGjyyfY\nYUHDS53A5GJqNC6/W0IqbBfW3O1b4FxtsAcgAh7/6Hwed3jUc40AtcxdUTr/\naa/eauRC5F7fs4TzSkoLG7PhdYlb7osg9xzox1G1J432FbZOmm6sjcv5ldhx\nqWxViIwxxaocV9AJWV9XGDSvv8LfluSWgED/PkAMGyY0++7f7IUVLLJP23W1\nkthbsrft6rIfs+GNmAoLPktIkM/CEXsrOI/rlXkBrbKRBAzdyq51VpKM3XhY\nyfCKuR3EmiDvcAxDUz3Iz6Hw7XSjisN8PIT6UnKpaV4zbngGkeQ771PqymNW\n7jpYcuXLzaWXJ9QbJjarqZtMmEOB5tp4EloKfW35+rw4/5tOBPg2ZDIdA9is\nuhleJ3wYJzjOID2E4q3oYx9ridZbIV1NTE33zwYownVeaf+LOoHLeasV6LrF\nNwq/gaQQxGwtNNWM3I4/UehyRrdFmeUw9ffc7KnJ0sZc9xHoi+S+5yg7Y6TD\n85Nm\r\n=F0GP\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"bc1b49564897e364fdd2e5f0903ac31d9cdcdcd2","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.10","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-beta.2_1564425156651_0.2901734952347357","host":"s3://npm-registry-packages"}},"1.1.0-alpha.28":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-alpha.28","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-alpha.28","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"b73eb2ba99b4e25bdf5853072f64270ca40ec4a6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-alpha.28.tgz","fileCount":65,"integrity":"sha512-pNVzRAKBQ3N+DnmR/cU/WWCDXoPEVwgfBoeVDSWMwylrXOOYTeCTGg1AcuWJjxZ3gEB5+fqFNHvQAMryAuPjOg==","signatures":[{"sig":"MEUCIQDTzQea9ns6kF/jfKePsR1UldEaLTQIq5P2e0toAAymiwIgJmBxPR0Or+JTUvo6w8dg81xWlc8ZftKTikg0rErhZXw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":675556,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdPzwjCRA9TVsSAnZWagAAougP/isVfkUtp34BxaxsMYk4\nox8fv6QELIw5cOxruQwcKhb3SmvkH6HIPYBMbsyIE4UdCDY7KBcwkVV+R208\ndUT0tEzOkSbNCG88Gwty2jzpKWJ+HAxU/xdFjlnBAxRC/HykdvA28+8AFPi/\nDRVS3waxJMWhAATVmq4o28nrkllI6G1wqiHFrY9JI0AN6szn/mULEwuLuZcG\nbTWqJe/HAmjcBnE7J1+MdJGTEIThAnux7zFgLyH7pHwP8H7CK0oiE7ZrPzmh\nZvzjSWeGV6A+hqx1QCaIV8rVtgcQYsApXOW+fn1cmj41lmBgRbu6KVYaJl4K\nPih2cR8eMVYhz5adNxmpEtUq9pwaS+uqn+ECojRzaJ5JLZEq1guhScATlknw\n9pKnv4DGxurWPp+axuYTlIYHxFpr8MRH0Scx5SuSN9B5qbJ8DD1NbO3X/GfT\nqwI6ihLS4GUsb55vkc4ozANb7hOa1WcFEzo0AQpg/h0V1W8e4AzWQQlo3g3E\nWi5BaiM+OR51l5kHnkS/d9Qbtjpb5+5zCt6hGb4ITsmvhq/O3XUxiq/XQjwP\nlJQ+ohzYeQ2AypDOWNwZ8ecJcN+ha7JNP2qmCRu4PJJWccmByeFf2wie5wpV\nZBgjiZDvfnp07jaEmo+cQyUG9+u7cqkFJwjz4LU1oH55ZRi4fgX6d+kjBOm6\nqlNC\r\n=CeNO\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"62e032dcba5ab1d74d87b4130e4ce2f041625a23","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.10","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-alpha.28_1564425250441_0.8175477725347597","host":"s3://npm-registry-packages"}},"1.1.0-alpha.29":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-alpha.29","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-alpha.29","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"62ee223dbd11c89ed81b07f0f624585da10f78a8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-alpha.29.tgz","fileCount":65,"integrity":"sha512-vCL/rTYAOpNxcYnah3Wr69ZKDXwyMOoepHceST/XKmbiMoJPJ9R9E1puKgKJ78cB3zyjrzNSXmFJpBfFNh0upw==","signatures":[{"sig":"MEUCIQCF8xHQZpo7LlJqpoMzMnOKFXayGOTJKb/o0Y2u+kp35gIgVYisHsXri/yy5dAWQfQrNLY08meFb+0XF0o5lZ7R2OA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":675556,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdP0v7CRA9TVsSAnZWagAAHboP/3R01FWYbcvgMmwjkiGC\n/njj/ec3l+FCqyKZowZgmp5dEz+lg+8CqEOR4JKmoBRUwfitdXbqumd63GNQ\nSqvEDvVJRgF6EGXv/28sLvEtL25vyGgWc893tLUK8cJb7oZU1qVI9XPdKCek\nuYRTqGFtoqLjYa5F1dCcf3utJTaZW7A/N0eQFPmRWhUMHI0zDude1R7EM3ki\nHwfvvdLDDasE5Bf+RcPqODAzdDrRD5NbuzahfosDXxBAWZBgGTmhaE5bWSty\nzBS41O5wiRMEPf19XeXfzQ83YIIEInaN0QQz7q+v3RY+48KYxXfdU9mmV/iG\nTlEhNO3FG5FyLlPcR2V4hZWqoZYCB78q21k5cE2P0xwERL7MkWBf6bTO9MGN\njAjql9uJ2cVMwI36EIVzmOs6Du+g0j8nvof7YqxTckW95uxTVxvUVe393RoC\nI1GtdHSkNKD4ceaW6fnVyuRn/0ZhDCYUbQJe8VkxgFihBUb2EePe0IOt+qIf\n2Uy9KTCt4Qz5wJh7M/zznFuoGwvPCa3Po7+Z0cCPwwB0IPMbaNuracuR6xDq\n6gH1qk36ZXZDjFr6hlbJExHj1isQML0pdLQJu51VSnbZeb1nLilghalAaRM4\nyiEnCnuSuXgXXqh1mkD6ha8HlmfbnwXrHLP0juqCV5VIoQWGeWKM9ySJcY3k\n2vx5\r\n=BdCb\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"11b7089a5ca331af03e86bd7b1278922700524c7","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.10","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-alpha.29_1564429306363_0.4040059672424927","host":"s3://npm-registry-packages"}},"1.1.0-beta.3":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-beta.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-beta.3","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"3a28d2d4cc31b89aad1d3e1c6309386e154da5e8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-beta.3.tgz","fileCount":66,"integrity":"sha512-VihnB+yzC+ypbjC7LKgJlzoopJV2dEApLqDY5Oep/kKZuuhsPqbMT2RTQe1yY5qESSNczpE3BSpXnZDt7fvBQg==","signatures":[{"sig":"MEUCICGK1cGGWahL4Szd+wSpArnJelEPZKUpmWGohOemIK6iAiEAsb2bx7IIOVO90GUxnnYko92txwDv8+RrI+q+IUPIbA4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":681885,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdSC20CRA9TVsSAnZWagAAn3kQAJyMs3zGMTW31yGgR2r9\nYcnvNKaedYr3pEgYnwpiR3JMHx4hRPezMqRntVBo/9PugG0/c6rUDTTn4tZn\nQEA6ZILcloKuiel9XKaTVU/j3AAF8x174suHNUEd4mOYk1RDMPXGCyTZxETb\nSvEfXo7Y8OIFDrCD+npePuv6QmwYN8K86hGZVSqZqaSPTjgBRnkGropnfaAm\nbC2yLzwK7SOtYnYjS7PbqswztN8WkzAj+Wniu9zziVtV7+Qrg90tYDwuLilt\n97O7vhM0O/sBZciDiPDE+IsPnFycuiu/2Ysea3Sx/QRmEwBkXI3ONoGuK4/f\nRbW+I0nDyKDiobQel9sYLHSk0K/gvemxlVi1wVr4OJqEGA4T3JfJDK1bi810\nkYxv9/HPog8Vj8eqKywvhNarm+352GBdLPj6C+yGC/oA1jg5g9ScDMHSc36R\nNgWdE6MREghgloeDKRJAQ0h5GWCdeg1A4zE9yabAyXV5PBRkUXlyIcB8sjIi\nAaGH7GFr8Qo5a09upT83Q/ZV4PiY4XzKEpch9+H2m034XRgW/rnLuMB/plgR\n2eKebN60RKvFXNIOwgwDvVoGGCguZZzfAU3p5I2XipcLCtLeQGBM6VZHqP0C\nunI/bUq18avw81uFppGfToWnv2zO4MvLsahEWjmFR3iaHPKJ4mC3/u0QIx4q\nXcuh\r\n=o4iv\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@apollosproject))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"4b576373b56239af190042045b81ec1ec96dd245","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.10","apollo-client":"2.5.1","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-beta.3_1565011379415_0.6751254816761287","host":"s3://npm-registry-packages"}},"1.1.0-alpha.13":{"name":"@apollosproject/ui-onboarding","version":"1.1.0-alpha.13","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0-alpha.13","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"79c9f2fa7d07003d4389d1bdd9c9eb00d7dfdde6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0-alpha.13.tgz","fileCount":67,"integrity":"sha512-4E7+x62lqs7IP6yLUcZkeAJIusKGVj+hGkopgGHpAG1UuS1HLw2XVu4/TgGs528J/DGgHLEXGB2dpzmddDAfWg==","signatures":[{"sig":"MEUCIF/VJy9FS+NhEt+l/deMspbwswMfaA4IDUK5H1xrO+XEAiEA6vLDtf6m/6JHxzJiOp4cwmrop44/usmypMvVDeoyZKE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":676049,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdUrAvCRA9TVsSAnZWagAAX4cP/0/0BsEPpXEmQFpulxa9\nNQcwnZDkBbGoZra/IRe/zAkABRZKHZ4pRgHi7ZcCKXAL2b6FUkRUD0x65MWx\npOYr1jiVJZAXbxi6U4hQKAFdenGTIXkikCOFBNKh4MPtSbX7fuXDO5KhHkLv\nP1fN8CNMD7rOBEKoAXrlKKo4ro9Miq7Hu0NpAW7O2kUM2f+DcC3zi5bbQbHc\nCBFzTmoN7GazsHzGfPwD9cSvPl3vlZYG0iIRIhcEj9yM2J9UU8LUdYySkIg+\nAMnRnTUsqgxm5hWOIzOmESXSMck0cDy9FZMqZ7EgoFZmvb7auik2bJIpehub\nr36+bxG1W+V/oQUZoKdaKP6+wRqD7wMzE1/knpeYZv50Qjn/pphomUVoyDV1\n7wrcLovqmgxIvqs9VMdrIhFBNNWmsJe9b3/m7sRborYBApH1MB8dt/8MAQuX\ne/hWsojd7B/JwsDVzMwbUyTyqGt5sikLmrZ/wtICWYqSv87FJBk/Sv3Msng0\njlg7LZQYwbzLkEO8nXrr8XWYf+S2GcfLlvlNzWbffogw2gqLnqizmOCqDHDZ\nVMAtDcSqErLUCAU5/nF2QcbESxycEZuESPuclEFXXUMpITTpV+AHWE7ky6wu\n/HxFOx3uil/haSiGAYeujboiiF8+zbc6GP6WVBr/Y0faCgqsgW4jmyYwXhNy\nxeYE\r\n=XQQX\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"e1b01c0853cd651f602bc5a980b9f53c499f6ef4","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.10","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0-alpha.13_1565700142337_0.7420050010823491","host":"s3://npm-registry-packages"}},"1.1.0":{"name":"@apollosproject/ui-onboarding","version":"1.1.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"efceba3eeadd36f7e5e2a912c441097bca1901c6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.0.tgz","fileCount":68,"integrity":"sha512-sJ5fDc3FqVzftLi+THTK78HrgpMZIKy7zA3jF6w0x9dLaZ3oxE2teUMOrbaD/5r1f8zYe83o2P1N+awOrlExGQ==","signatures":[{"sig":"MEYCIQDMYxRtHf16dX1DWep2LGJFXgsmi7mNglnb66hzpS5LoAIhALiAk/JI8xsft2Rf7M71YZ1UQbe1ZWITX1FMwWdnH4dz","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":682180,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdVAi0CRA9TVsSAnZWagAAsZkP/3BPto+N4tpEsuloyAmO\nrW55phIzoK7l1WjHh+WTWAl5oj7j+rwUDYTrH6s5g2vhru3XlLkdnYKC5MFB\nZJMfUnadk4oQD8jFfBNF/FTsuqcIaTAjHAUF7BtWMQiJprpylCeOYZkzVy1r\nnSkZwH/ht6Ut2fEEg+uXGwzblEmGncVpB5dQf/zHD5KtrSdKfhPSiLwbDrqS\nUl8OovEB7+T+nsYOYM41g/vfYojlT920j4v1T87d0aMXF82O86JVZXNYKuHR\nquWrNnGsTGelzrrY0wX5+fgTytvEzWiWXR/LcFZyjjjpiUtAHiMH4LDCAlZ/\nbX8o1fOabCnCkVCip+kxczC39helY/W6HGkNGUoJVvP2lqQDMsPBzTXZBfIF\nn6XOhLhRq46z00xq+1EGSAT85wazE6MzSe3vBaZu8cAKwzj9ssbpwVAMBYT4\npZWRaQucmdzUK6W6BiTGfA4aAX8fAQM1dI4GwAPLTZG+YF1w8F5CxRVxyVZg\nO9096i9QJ5rsvrD4heRrIM4Ev7ydgj+voxrJfsXbolKAur05w839aVSYIS8R\ng96H7gch58QVPWvGV7/kvI1Hl1fFZMWdsvj9S7L9z+wjHVutMcFyfVngeiIx\nbcn2j6jyVn95lvPSJfl6AYF9Jqobb/vndYmcddTybyYbeGYQtBvQeC2toB4J\nHjO9\r\n=E/ii\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"289b5ad67588c0b0d16fb89ba6fc3059310f4d70","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.10","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.0_1565788340073_0.8479218181117851","host":"s3://npm-registry-packages"}},"1.1.1-alpha.3":{"name":"@apollosproject/ui-onboarding","version":"1.1.1-alpha.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.1-alpha.3","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"1de93e9d8a581830fd7e021906f99dbef66d2eb4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.1-alpha.3.tgz","fileCount":67,"integrity":"sha512-oB3iBOXcP8Ef1PjwLt4rvSzYEQz/F6dNawbtxezNbT2lQm6GVQygpM3U0NeivR5W9zFBysYxoZfROaxSrkL3Cg==","signatures":[{"sig":"MEUCIDAu6DkYX4WcRNfiy8MEcJG/D+PQGIFH36P+9oaF8TrlAiEAu69VLZVkHI8aiz01huZwY3b7gdrGszOBPTEvDWb0hLU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":675988,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdZpmsCRA9TVsSAnZWagAA2UgP/3JJ931GEGAMIsPB4i/E\nr5qbgu/TKh0qmoxbQ2JFjzDZklWOwytbi36F5guNm9m69RYlbMT1pyiOE4EA\n10wP50uuyz7bxCOZqJSLk6NXI9x97X4JNESyC67IPL5YDyHzBpauBthcf2zT\nX+5b8f+5qhKfsL9YnLWr3KLjocFHhkgRSFftdnhV8WsQ3sgyu7Y9H9dUBmxZ\nazAyv8nGEW+cxlIUROVDgbUKja3DutMUAwNUBCu8LbttOtGZjYKuscw9oFqJ\nWO6pjVWM8d1DEod19QA0B+rpZ/noUevF3kBojlTHNfPr6MHv5alHSUZ6necM\nyzclrlfBQNpkZmRwx4xYW7z2h6x9BjtY1X+BM5l0YLD5rI0KBJ5fyPRqux25\nqwFm8ZqUnw0tC9yYb+rZJbg42qJvZxaP7MmiMSJ7G4zZbBV1+BZ9r0Z3pblc\nmkl+wtusVCplDZ35UXgi7L0lHWGl8NJ8DZ/VqaE3zpVGmWvOZxPMB14bguZD\nuGTitb9K3rfmGFKMJweiR6A8YbSxKDlLljlTfDdwRqsbWoJEAnt+jJXTm+zs\ndqLNyBUo4fjCyruUsKFMyOIuDiJa57SFzfanQsYz/rMEco0o3baZg07YeoyS\nsiKMI9VYrU5TmlOsxjr24M1oGzIGVaSO/R3LbipA9ajs13N3S8uKePj2Q54k\nerHv\r\n=8Gxk\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"da064f4caa98e43556a4415b77d7776e879ddb33","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.3","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.59.10","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.1-alpha.3_1567005099738_0.0825545641123453","host":"s3://npm-registry-packages"}},"1.1.1-alpha.12":{"name":"@apollosproject/ui-onboarding","version":"1.1.1-alpha.12","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.1-alpha.12","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"21b385ccb763ab461099a9e17ac5df43a0839f76","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.1-alpha.12.tgz","fileCount":67,"integrity":"sha512-3qVzAB20m3wZ1p1tT1piGKr7mh16Tl1gWgcU0JnTVjHPnZzSSrsqxdj47kyBd/eMMkEAZsgN5pZ1OD4Kt+6tUQ==","signatures":[{"sig":"MEQCIDdhL7FYijUBJjLQJgEezosUSKYRIZ3ZEU5dBEK7AdnnAiAx3j5b2wefxFxKnRNqv3vIsCcSbMkj6mIoggqmke8b3g==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":682576,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdbwnoCRA9TVsSAnZWagAAQ+MQAJzp+TK1HeSqgMMXUiQ+\nuAnfwmftaZKpSXc7s1dehI70ad5wuZguwokPoUIkiT63wBxfZhgdl+TNklCl\niw7aGxEXcHEIkiocAc6yp701De45GD7HvxuVBccaa2XDjfPIsGUgSrYazE66\n0FQsAkd2ViI9SwYa4V+qmKK9TZsEqgbgmxQ2gmys9Bd4M8SmsySXbDuJfb3J\n6yElej/8tUrQd56B/lYQLRl5/1xvT0pHU0LBqQpz9ax4xDIq4AUI+yqF5KD7\nKcCPaSI2MXz8tYXju0t6amxpN7Tx0zxlc0v7EEjhN25IwJC1I9qbrcSt6JhP\n63oBRja4iYPTOqYryECuKQjDhntmdUcyVw320QCVUDTE0JqeQo2ffnkk6lMu\ndR0K2w8vjeFK6ahcAuaQILg8r1FMWjFOxt+6VmPujp7hXNoPIt/5Gl8q78c3\n3fpySpoaiLHR6L7EI8UDBWjx7fZG04KZO1We29DgJCUlfYox46g8ZQulyf90\ntXFuWwB2BK9wTvIJG+YoAP6NNwqR/qMuHVUovmEBIZij2y8FtE4xVyH1eihO\n9UFI4ROMfFonZcSJrLxpz4jmTNjRpMlchpvvADcP5i7qz8Febsu29vQkP+tg\n7v1Y5jF4+CO8PqRtRIuwUF03A2OjEUm5hQVIFPgdgEb7dUlVI8XNfpGaqjNN\nCG5y\r\n=USiI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"410abe401886e1d819134b826f16872220bbc379","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.1-alpha.12_1567558119829_0.7284135739535142","host":"s3://npm-registry-packages"}},"1.1.1-alpha.27":{"name":"@apollosproject/ui-onboarding","version":"1.1.1-alpha.27","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.1.1-alpha.27","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"b6b38b2580e4a820af8913054cbe2d33a49d2b24","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.1.1-alpha.27.tgz","fileCount":67,"integrity":"sha512-BfbrttLJTlTKzG3zj6PhJnd9WFvALJ8TLrf/zt7EbYJqjmx99EVqx4q6RQyKz2i5D9DFjvXAg2oQXrBWMKnMtg==","signatures":[{"sig":"MEUCIQDO8zrKA2Vro5lZbp9gefE5g1s8yBYY9U1a/Pwc5qgXzQIgMsISig36UUKDQO217zUE+jmG8eWJx7yIIwhFrtO7AgA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":687976,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdgQXQCRA9TVsSAnZWagAAmEkP/RFzly0lHj0kHLa4TCHg\nBFe6OrbTj+wW/dNPOfcSyRZwkKIqOS47BRGrrO3haZkt8ftSngRcEm+YYdpE\nz4oY0iW2vHCmdjpBXtmSD/dSEM6WmGnH9AxnIhyN8fcobeO9IbxH0QLzLCcL\nCOGV1QSDEm6/IGAeUcxUVHuU6a+JFfqP778gWQXtlx1C+Q/9Z5yleaFK3CdM\n6yQEM8ClPhlHuA73IhU/iFpHmn/gOSWdmEFQaMwiWY/O+X6uzAAT+mjyA9jx\nF5hwZiH1P1yesxuMCybv6whJq6iMdpq2kzhjTm2o0LSX6aYqIJkVnliHBwXJ\nn8qxQ2Vui/AaTo/XS2CTAqAxKKhnw4+pVhKF4VH8rlrwlSYpg0UQAv5c8m2q\nCUODPECSNNICkgtBah/RA0Datyzj713h5q2hTj016eunBqboFZ0yb33wBCN8\n+f+RfPU6eZ0bsSSlTCSYcxt0EjSTZ0oNJyzakHiX9TQbA+l82QE+MdVJ8Bt8\nXiP3d0VkbnK4J4v6uSVWvHPzUEP0IcStkHfyvMkSwkSs4v/PAm7KGVeXtcCM\nq7MH0+FVssQpQyyNzAQaNYeVqslZNuWqGhRa+ZxEzPzE3rf3toyYdqzjQ6j0\nRl133tT3Py+ELk+LzkUdkmjddw/CP9FH8/bhAgQX844EPE55Teht/1+1dckT\nof7k\r\n=5Y/n\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"c959524ef9235b2d56318eaef4048975c7ef3048","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.1.1-alpha.27_1568736719422_0.192831326256109","host":"s3://npm-registry-packages"}},"1.2.0-beta.0":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-beta.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-beta.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"343f474edfa1649ff4a44ad3d8ff932fe5a34f24","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-beta.0.tgz","fileCount":68,"integrity":"sha512-8GWJmatJSuDvbaKvMObFF/fWJzixQptyHIj3cKTY626L0HGqxNXvB3pEkpxRa+t4ijitQyLhehfRg4l6CKefZQ==","signatures":[{"sig":"MEUCIHg4+RkygQjv9zN2MlF36O3wJV3cHajE16zQJj2d4aFYAiEA4WBJDJ23HF9MhZLXjMsdYfQlcvtB2X9tlmtIILY1CQw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":694114,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdi3VVCRA9TVsSAnZWagAA//cP/1WxhYgRay+ziZtBaxQ6\n4ycJRvCFg91y6iAI2dnbKtadQVzamw11cy85PsqLpEk2ZBtqXxglCywpMpSh\nEB2Y68+7te6F8CODSp3RjiZ8GC2eYiU9mPrgFoqUBPZTHNCdmT4k5AdUEdAN\nfsJOLzeobhhrT6IUeEjM+2/vzO5AlfRMgq9XQMeZo/L8h0Q8sJzhqHcJinkL\nPh3fioNEdSwFGvnSGYwUPNX/ImKt00edDKaspvu/MkQD2fv8qBROaQEHMY/C\nSTotK5/n2yDzepRdPh5jzBde6bEXMYe8ewpHkxZ+BGqTqDnt7AIUOa6zomIw\nM1Ukc6ek4mpe+49kjmsXYmW6VIOcJ1vb9h9Wp+tZnND883I82ge0sR2iPocS\nNeb/4YQi9iP0lHPrqy6CxDsBBa2DKPlwckRuhIdmKtePS9Tr9EwtoIsBMYI7\n36c+HaiWyEb2QzBLzEaN4K4sRu0C8OlrE/OqHa6SlJLWDVQTl5Y3X5GcCvgT\n9BjoAKVoLpb00ypZz7dqh76Fe6sjDuORCGXgCxh9MM6ZWjKTYbxV0l2CQk77\nbQJHVBeDWiZ7oyUo3HtocztM/QoISUmcKgU5c8bY1RNPAf7oPouQKeEWE82K\nCEZp9qohPS6ePOxNouQUHfG9ivbSzogUhDsLdDxzf3/dhb5yzmRCEA48vpQ5\nkilo\r\n=PLQ2\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"ece86dabc3a06c47e9623b842ff53c2b13db2944","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-beta.0_1569420621630_0.5934812533156548","host":"s3://npm-registry-packages"}},"1.2.0-beta.1":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-beta.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-beta.1","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"79818e0fddc0607cf752b1a8586a751cbe4c3e92","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-beta.1.tgz","fileCount":68,"integrity":"sha512-BW/Un7tT23VQBqonG51xM2DJ1L/YUQgy2OnSzLhuzWGkg6oqAQ5lZfXLXq3lr2BIV2YXqMib53uGl/a8iLSHpQ==","signatures":[{"sig":"MEYCIQD3FQlNQYolZSJVPdlcdN9M0FLMfjg3XmWVbNBwoKHT5gIhAL9EECfIRoNsjsub++jN3lznbOijnnCkNVARCzj8/hHn","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":694114,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdlKhtCRA9TVsSAnZWagAAF6wP/RGQAlSRFY2YeXqiiizJ\nlextroYuYL2qZ28H5KLibB6nzNVHAuCeGHjgOcv/3vdNkn1hqk/oNutE1Sey\n00bdnLb0Y6M6GRnM9bCDzHUSwQBlDy96REk2XrbAvqPqjXKSTvezYshfA8d2\n2uel8zhkeHiLykLe0tweBsRlQt2Ba50gN9YBcWCDqmHIbSQEBhQvsK068AE6\njMBADElWr3w/EH88sc9EXPWJdJWpisrF2zDrMINoqPjptk86eRwlqJz67FNQ\nloPlYi/iSKac/l86j2yJbY5h6y+1c6/so2ogLSmkfukfSq+Gz0Hp1LCpeTUv\nasVfXr6lryFpfLVvRagwRDjzzOyYAZVNLb8rPttI8U8W1ekWqIEvGOPw7wv0\nVUV6aVPGkkA2MTv4Ac1tcscAj2OmU/iSl7xJukczcH4HLIKsuJe7WYdPkZ3m\nzvg7aNXSkIEpxvDXy6D2O8TUmzv1uFhSur3ufgVTtors2E0r9l6Q6Em3PVIu\ntPNWjeAcJwVJmiMaY8NFtZfy+tUNst9Bf6UrA3Z/h8Orap+6vA68kAhuJ9Ql\n37EacvSWkPTFG8gjYvJRFTdqbmPkwU65p0WdDFH1YG740ybMvbCP5FgtvV+O\n2GIpsjBHxZpbuFhe+EXQih0nbaYQMdDLBJEFKHHzBZQ07PZbezdbbRoVFTKv\nYSem\r\n=LRuc\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"dccdcfd414897b4a1ce4a079e5d0a93b379e7f30","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-beta.1_1570023533077_0.7463801214725381","host":"s3://npm-registry-packages"}},"1.2.0-alpha.1":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-alpha.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-alpha.1","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"93085453b97b5ad0181c7f2653e54629fcc4bacf","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-alpha.1.tgz","fileCount":67,"integrity":"sha512-FW5Sj/4Cbu9lJKWsKyDE8nfZc/NN684/LyaCy3husHom51mfSHgZ1/N7gCsRZ3RnZy8Wa94Z11h8Qm7UqKXNyQ==","signatures":[{"sig":"MEYCIQDKQpbjWo9jeq5mPHbwNcDzU1se+70JDiP3RxqDhqNF8wIhALRe7b1pQHSL0Q4sP8JcpO0sn1N2g594ZYd/HuJY/ZEL","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":687467,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdlOehCRA9TVsSAnZWagAAomwP/RhHXJ/mKIumaVVTKtza\niwzeYY0M6bYUtFNNfTwieDpBP87lNaFX01RfRx9k+Fbec1+3P/K/xEU4632K\n+ydbe5YgO796dg8PeLUbSZbBNY/O8g8ODOAVkO7SOT9FwuiWZkLZVZ5iVjpt\nsgLkp1NjUHj+mPx8WBk2kaYJX+Kh2b4M1x8tFVLbbKPFIusq0f/K0fLEd53w\nXFnjnI0zUCa0MdgczkpC9HVw7xbnOltA7xek1hMsxt7NDwXkdsoH1gXhDqPn\npRkjagPZnsTH3SCMtvdkL0QKgt3DVTSoF2qjcTMz/7scszlcKOGt7sGYx5HC\nmafwfoCNH+8d2eYEYVr0Cb98IMguRFhuKYbo3YI8q7vGGyK+EM9YH6oG3xvN\n5IvT91oBMXgMHOctmfEbr1wEY6VUM7q2MelI7q8Ve6c3bs4ufEbOyYT+Ar14\nNgPTy+ZHZO980nzRBOFhawF8Fi63Oi5t2vl7If9GGGGKnjGGT8RbjNTl20hZ\nOUKi1nlAxfC1ej4OhQZUl+HEcQW/r1d6oRYxwVEAlVhRi/d0HWlsbvyjV1W7\nGqCHDz+LuHG5f7vFdPWwqV+UkIk3fuJBL5LcAy467AJR+8OYjN1miYzyIc2X\nY2RDtpLAYwpmjtr4r25bhwAWpjZ+TrirhuO9q4Z1VxMvgw6xagsy5QZZfoQD\naF3R\r\n=iwZb\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"6efa7f3d88cf4190c330a38869781244785fe0a0","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-alpha.1_1570039712601_0.584239928492422","host":"s3://npm-registry-packages"}},"1.2.0-alpha.5":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-alpha.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-alpha.5","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"fbc768f79883cd88ad2b74edde4c97f287170093","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-alpha.5.tgz","fileCount":67,"integrity":"sha512-d1oYME+cEfMRs5DWkFkMhNQ0S9gf5j2TrSKsQ7QKqROvNfchCZnmeFjgVmADRHmDMzWYBq7wzxGoQI81jvcLOg==","signatures":[{"sig":"MEUCICo22E5qD9eqyMvHNmvKrDbZ4kg/lXi+nWu8TarDR8YOAiEAz8NOTALIpMdSdtbc7jOKKzrmnOyBXLcYF95ibhIh07A=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":692683,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdm0nPCRA9TVsSAnZWagAAhLgQAJl3sS5LPJPDeCnZ+/PH\nrMR1DAgM9gifrF8++CieFLglkj2LmDy1iekPaS15Y4B+n7eOjJzinQUJU471\nyKodxZn4Q2EQl+Iqxk+9p32C93RFDJkJHYuaFgfg/7ekDQF5chtTKCzQrFKH\nMwYXXXne/0YS9vlnXJ4b7GgWwxMyOmnAQwaW0F20hXmT4Dm4z1DQiK+MA0E6\nHIyeoVLCBgCpuleCK9g07tAPxSFVvhLhjJrqo70f36v0Mikc+jDdNU0sWC3h\nYZ2YckRDRoijBWCc8vKa0398Fd1irpLZJuKn9+e9suMNdkWJ82QQhn+OyA6+\nPBNs93oRQxHXvBqF0iMpYK5k6yYuwEuMeTUZf3YrP0s3xDr3dbP62PKTjvO8\nAje6U3BwhAhuXdq+u9EBcVrqEIqjYDgQHJihlLP0Ws47Fw/OCVHpDLntTCde\nUpRQIysIimDUCRvwRpXLZYM9LdE3+NlJ9i1I1vi2im8oHv6tUf12/alcLAxF\nY/+OjGoEiavNaojlwRQcu2nCG6xAt576F+k2vWkHhfXiHHFTV+d9lZTuypMH\nYcgJ1W6W/VCMa0HIEJnS2ocq5Owr1pg9hghy9UJiNomoWMffySRvWhdyXBR1\nldisS/gd28vRCLnUD36IfnJV+S43Ncn1xclITKOG5Ep+d3FRl+UUrSZV5UJf\nd7Ca\r\n=hK1m\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"5f23ed9ecbecaa549af9a891988edcf759e771cc","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-alpha.5_1570458062234_0.74269767169829","host":"s3://npm-registry-packages"}},"1.2.0-alpha.6":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-alpha.6","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-alpha.6","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"455c1bb16df473ce52e9948985fc339c19d66415","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-alpha.6.tgz","fileCount":67,"integrity":"sha512-8bp+wJfKowRzVIqCfzxNn2f5MWvdzsbroVEYtAuTH8VT1lzNsv95pNk11fz5pC0Rcpd86qUPxO/G4YlxCK8MYw==","signatures":[{"sig":"MEYCIQDml5GhYUb+tNjCMd5vLkhDLi3ZaoZeTMBhxtwIX10xoAIhAMAbqRQeODbe+SvmNbwWIDZlQl30qf3tPXcBvwP05JwO","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":591654,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdm1B5CRA9TVsSAnZWagAAV6gQAJ4clgLondWuYn387nTQ\nDkQfOKAw0HT6S5K66J2CtnMPN9iNOpNDQhzcWdff4VXu8Zb3nMoQvy4snA2u\ni/kVykiM2/Dk1g5RbcYBrbjnqxj+iEuf+k+s5JTt8CsvvXSE2IvjGc0I7kDP\nzuoRUdExHzPSLqRzW3V8G6LfVyfpF01WN5o1LUhvDnD9yB8a3+5vqNiyqTkp\n74WEZOFKiaLkoaEbHF+sJt1DFbEBRN7LbLoKHFwlovduM5rIUwAlKhfT/b6d\nn0Z5v2ZPWXLLf8ihohz2jvkvCMkAevycDcCrOrrz8cKo4c48DFpoi7X8wg2x\n/53Dk9Vs0Ba2EtfBlhzqu65jn+5veLCM51aXIJUOq7fJ/v7SnkfT9XJunDkW\n+wfL2T+FpEDQ4VPkohyzt4Fe6Um5PqH70ZaLheTvXTNWpuzQU6Ibu1nzykjx\n6r/1d80T3Zs7miV9kJHpSMZwOm/GepT9pzN0cx65PhLIJph1l1ZEKvGdR3nD\nE5d++LUbOXHiRnagzCfypT0VOdkKIS7DkKf6pRBFsxQuUBQsVIvVJKlRNeu9\n1B91NE3dk/UNNU1VnURrstAib/PWS+esM9IEqDEMuOhbACmuZ1U+a6hOTh8s\noAC49v4zrz5PapUW7eH+DVKF8l+8EQQN2/fiwMDAF7b73vikq2NIWqFZaq7y\ny2bA\r\n=xpMM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"566b20ec3e3717f88f625d8f65506102d60e5eb6","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-alpha.6_1570459769283_0.2740228316338804","host":"s3://npm-registry-packages"}},"1.2.0-beta.2":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-beta.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-beta.2","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"acdc4468431e6b474d38ad591d15bc935b4f1e9f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-beta.2.tgz","fileCount":68,"integrity":"sha512-SD/aWqzClE6j+yJcR9dCTuS2aJn3aQpKI+ugkhMBYVP61LkgS8MHqSr60af6ZDKf9dOQOObgqlAprVvav5Pw8g==","signatures":[{"sig":"MEQCIAwvDtJmb8RHrc3RhgG6P7BwKwl2wUAkzYFAhhscgY0PAiBPE9eJnOMQatQPjuOXgc/R6bQzg8CYA7jQFqsmIkTK+Q==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":597793,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdm1YSCRA9TVsSAnZWagAAJQcQAIDpOSZLpisZtpxReiT0\nI1ZFeIjd90LH5GvXrymD7Df0YsaqQr73RSVVsbFzpy4i9eCyGJapeId8Jmum\nTNyB8U0xhj2rETL1y//7LLFvYWfVtSj0CGOioO03urBJqkggOIZDwXjNqrA5\n2Xc7ktV4Kp4+FVpVdAqBt/1st+KEa8eb36LH/skZqsvVamasgXNRiJABY+yR\nDcs9v6NrxlYsMpoGdnPwf9nR3jImr5EqP8N1Y6ufT1ZM8xnJpc+qHIuHVARw\n9buyT8ncXU7XNrts1l0b9FCI1fhMC4B8cjDzza6gUS9fcYOimTDkuXIEr72s\nzvxC1Hx1rjc7kI1VrHh+39es9HRPkDdbHbXL61XC1o3bCAXwWOpVRN6+k2LL\n+BwXhN/148+hLCvSis2k4nKt4RhZy9kMFZQYK4iLwTAEgQPjmMfVpQFp6Xfg\nFGa7U+S/RO+Y/EWIaRf75DQegW9QD7Jq/CPUmf1xXJkQitN643UZNafHVREL\nF4hZ6y1brovInwOrYXxqhRw7wr4l6Px4WJ9IIbo5IyCkXWj55MvKsoMB3VM1\n2eCpgvB+l33Qc9IKFf3FnQ/Jv39fp9kPIx4C8L/XPPfYU+m8WR/GHhWxbkV1\nee1WbI6rV8NReMQ1M0IbEeP9f1tktPn+5uYzzThZZROUTJ9Up6oQW/F7Asgi\nbPl7\r\n=JOMM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"79c803e2472ed3bcada49b12bf1e2df4799a3814","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-beta.2_1570461195045_0.8776687159534549","host":"s3://npm-registry-packages"}},"1.2.0-alpha.3":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-alpha.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-alpha.3","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"861854875e5e5be387a7b8e22fe03329c2d11426","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-alpha.3.tgz","fileCount":69,"integrity":"sha512-D466uyDc4DzhgaD8CPKJSgaXUfIuH2qLIgqjyOqo+ICNRH+/v24xokqA9Rron4FYSSX1NZpeyxu/DxNeIezTDg==","signatures":[{"sig":"MEQCICzVbT6E5hmoB/xOFKac3QTXLWFmwFBxeW8x6eewzmUwAiAaAbJZDtv6A4hO2s/BoHuEw7wQcjcQQDzgxltHNKiaDQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":592175,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdnLC5CRA9TVsSAnZWagAAb/oQAJ9rp7SxUgKJwL+cGvGk\nvCaHOLDdrH7ICNH7GqKqEHwS/SgbZtvubFVSD8hxXjFnEJnOA7Doyqy8jdvB\nzLvgxDxeC8AiYF8cS28D+nkcLTrQhcg84Xz6Q1fAk69jxaT8p7hfmLfkKlar\nejJqkQV5XFv0+nq2QPMcpouFkC0xR9xUveoh90RNWzrXmlTNg5fq25wxQJCx\nJXIUaFrhJ3ykJevZFyibVaC/pXvZM8iSGHn3u7we4c9cVLHLROtfFhrE26Ob\n4AXvfsUnKDvZtgbbK05vj1hVHGFIWL9oxtgq1+/PZOkP5NQPqs0eoRO9poh9\nD/nTGNhPGQ8qGFxfbgFxpvy5kNLHhFGimE5l/jG0Z0T5wM4n8u0uDt2RjV4W\nY4gNVQ+l5C1+SNSsW0bqYuzwp6CZeWTuzj0PdPxXqGm9LbSZ/fUQCjRprhOr\nSWQ2JHDOiw7tE5AgrMPWC9GmDwrefxiztzpNW953gDMC/rjhYcJymj6Lryt4\nga1jUK6Q5/hFkl6y4qXTJQAHngnQw4pmWrumjHKEqwERzPmHlj+CQutYaKfh\nJGvwsCh/jV0Cy1r70vPE434iztSn40LVNsW5fTM+2tnKSslu5nIm1/UB1QE+\nSD1AU38wnkQo1jIU8ULvzp5llV+u8byJZh7/efrhj4iLAxUQ30fkGZTZHY5l\ntwfd\r\n=iMdD\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"f76b0be66c4e67b9b1b7fb7711604ecab45b72e0","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-alpha.3_1570549944319_0.6022183442675573","host":"s3://npm-registry-packages"}},"1.2.0-beta.3":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-beta.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-beta.3","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"96da797b942e5729a38af435b47b13ab70f799d4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-beta.3.tgz","fileCount":70,"integrity":"sha512-2WUDcS0W/kFvmZDO3KXH1ngrKzdyVjLkUQ7ZWnXO3zOR0aywg57QWE6gEvpZLn7KVVl25llF20wa/Gt+T8me9A==","signatures":[{"sig":"MEQCIBqFmAG95zMA8NaGHtbnUShI9/ml4D+cRnQg08g3ZvFGAiAHOttgAhAFzXa1qzoMBM7tHNEfNtBYXhvp30fjwGAmzg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":598314,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdnztTCRA9TVsSAnZWagAA5XcP/RsDlzsEKdytXYuMud1O\nSn7YdunBa2xE/3Eui9hxQJmw8SgA1V81FMc4TCOc6Jc0zcySAMfVSLgHVgdX\nqynGI7IFaloWH7WKow2Q28RtnhwHnAc3CnWT6KOa5HwhJt1Uw+ShUddtzeQ7\nfZnhHxCmpUcTJmqRpXaTkiG7A4vTLfE0qaBIievpAtSHYGl7QHurKx6g1VXr\nlSsp/NNzZvVPGzhGo6S5PuoPQrS+DWNegLfXbyf3NIwLglcA4g0BlAxVkP/q\nDzfLBYSl4t5+Y9HwR2+B5C79Ge1uR/fd75fAcwJlgul34pJ//k+bBQXSXTM/\nsZ4QApoCsmsTV+7FC/Ig3CGpwBDtft6G6LzJNR04jgPCwsCAo8z4fYuSUQMC\nWezLueWHff99V9xTOkq2BtAW6CsjZfiIkaXyA77NG6Mypq9HPhR2T7mdxWPJ\nT0TPv/nCQyU3RmY7r3qCSC4mQWcc50t0EdUKBGrGsqqHF4h6ptHclbyUBMbj\nzHAbFHopl8HDG5yYC1D+RTkBEMjYB7rLXIxk43e2IFGUa2CWEayMGLkCwwqA\nwK3t34yPpdg+fI4Hvg6AunD1gncD1AcqgcACZG6/asSoUBXMVWGyvtbkXqEd\n34oQiuJ6skhh0PgK7ELGcev0RE3D/mtYPe6d4aiPjMDHFuWU67Uxf8IrMH/M\nTltA\r\n=8+JO\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"dea8a596427e2de29210f26564728809d21704ee","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-beta.3_1570716497069_0.10465623669964685","host":"s3://npm-registry-packages"}},"1.2.0-beta.4":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-beta.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-beta.4","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"c959367a4ee7461b2a9b136cc79e0f46b1ba8bdf","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-beta.4.tgz","fileCount":70,"integrity":"sha512-jFX9UkPi4BtI7PSYVJygXcRdPatm5taXLdFvJ7jcVoH43QCLEeVn9GZdq8UvhK9wkrx+4NgVc9tu0Tq7V3kb2w==","signatures":[{"sig":"MEQCIAPXDkPkvymqOse4hHr6GkBOCbwYzxjoBXVuPo4dHqbzAiAxpoixWb5bOTHzP6eQkspZE/RO7EnCsK/e2DspeV0WMg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":598314,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdpGqdCRA9TVsSAnZWagAAZ+wP/3z+BNzHiaKp0ndclYh+\n3Ov1EH6FVxxhyTcSbvV6QSBXNrKAojIRjA/wsFkljLpC4eK5OxG1rWhaaSGE\nwhZSFKGGaKl1r0az77M4kU1TGLAlYCuSYsX8PSM3zMj31iqQwQpyow+vCPO7\nbT5SybB/qfGTg3fWL051uD2EiVw3SI6oWyD6mdHNMbDqvik5sfOMrhJXRwzN\nUy4htqlKm9ADXnDtw1QhZbut+lMLLnUaHdfdnQd+mSgSum7qXzFDDQGq+LzZ\n4VYuES6QiuXyE7kycB8WTTcT32pA1N5PobiLd2HVDIyGhfIvU8fi/CV5ogh5\nOBS7lNgqkqCskXTLpb57ivjRxrq6b9AH0tPmFiuU5FVdXefN88Z3lad7R3yw\nCS8kSRfN2eC8Gfh/ExLSCGDnI8tIAkuF7EF6er/McDJHUeJv/hbS2v9wGSXw\nBrL51oOUPSx9u9MaUZvOWJ19FtWmFF6wiOlg2RN/2QWcsIdnsCxnXGExAE3F\no2QRQcudq3GH8ZFs/yb54Fdk/IKe6LGp/Q31T7l4oOxr3DnNSG3JCCMZNK3X\nbg/ZhOXR7Fr/ZZORh5hqEsJeLJ/SAXva+Pk+988QNPJiUzJVwgB6ZSLPTGBx\n959jqYpdty+Du8dRRaDpErHC0ro0UOkn4CcrF+pJSyylctnVGoFrgDYry7Z3\nVPTc\r\n=9rZ7\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"7c432b0ba334fe6a79d428e92d57c084b599672d","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"^4.0.7"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-beta.4_1571056284660_0.44099259090511356","host":"s3://npm-registry-packages"}},"1.2.0-beta.5":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-beta.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-beta.5","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"3cd76c9a8925dcac4f1691cea3476307b68f5a54","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-beta.5.tgz","fileCount":70,"integrity":"sha512-6FSJLTtkAvrHblBBPdT21Si6N7zN9WzsF4jnza2X+bPpOQ+g1qaB3dHWyAuC/zjE+WxGW87gBaTkG07OOz+kYw==","signatures":[{"sig":"MEYCIQCSRuN/GxUu0Xm+tZcGMYBFkpPBs1X4wT8slyaIiD0lqgIhAKRLke5QscUtNfDp0p7jEn0zg40v1bKQVPnsvz+8I80u","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":597945,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdqeaECRA9TVsSAnZWagAAOkYP/ApwrzU73IBYJedRzgao\nDUU2jB8ZIBQv4S7hWRffr1pWXFihA51Rz0tUsgX1xpWLrqI9dyI+Q+Hgs9/6\nnXz8avFuiK9kXoFFk021q7BCCgYI5Sxp6SkqRhWDVU3l98ir+pPCWQyf7ePw\n4xxTtL/ZUt+DnTBBOx4ODB0v6JnFs8JMHjNepHzqdHn4Vx43dKyhumI1vljN\nsi4EPGKtu0JSumZDzN/EKAgrGCfm/EgIwMaYY5IeT07Edn7libA1SXlf4o1/\nkTMQu0TKZhLhosauY2u9bPIuoTpjwSf12WTUXCtgC4EkkIiohF9L7uIfcOXL\nqBtSK1NaZd7ElvFqzGlrrK8iEDKZCm2pbT9ewQ1q80WNFBxTUynXSQuaHUUM\nTAMC6vXZ6PEdpCkbspWAGaBlCRSTvq7g4x4cdQbJhjeiT0g27BdkNuGoYwhK\njp9Zw0VsZYwaOjxrjfmBSJusIcAGW+1T1elv3hHdqNromqiwAK4wpuz1LyJj\n3iTFngi1N67+7TSmBTKx1b5psHc/dUyU5kS/1eiMOnpYQTLqQ3E8IjFqz52R\n3pLR2ILgsMHtww6HOyZdX5q/dhWsW58TblGwoFDdPxYSB2kXBiSWHk8C03Yc\nSmHM+wt24C9rA9Ilbo7JkTLjLHYWk/ikuHxGiU3lx0OPwo/TNZj9AY4rqXs8\n4xXQ\r\n=IWgs\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"2e812a4025c0bdc9d99113fe33b76970ce7371db","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-beta.5_1571415684257_0.3213005951683616","host":"s3://npm-registry-packages"}},"1.2.0-beta.6":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-beta.6","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-beta.6","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"ba471d6c3f1c9fed88feef74d7f6ce7268de0dc1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-beta.6.tgz","fileCount":70,"integrity":"sha512-GzO0Gn0xTNc12RZOk5gutO7Mdk8JEiS4/OsWf4nZDnrAZ7NoifNEr7mYZtou41LifnE7yXN+p/ydV62YRUDNLg==","signatures":[{"sig":"MEUCIDYaeDSXHsR9+uLWmLp7/caQdAoB9jfwIhRu1xrnlUW1AiEAuAvaS+0nfyA0IGnkUzScEE3ZUMCa9ds6gsJpPwb8BAw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":597945,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrefKCRA9TVsSAnZWagAAT1EP/2c3pzf0SGsFll0TF3HF\nMuWYSWECjdslMZlkVX/uD6cyRMikiSu87iASXFDhSxlF6fzG4w22MtUOtoPO\nwEH+s0N32fSv5goOcFqQoq/3RAdoqGKiPWgUtvfLMDfFpba3+UX3Tx+BsQOV\nC1zb2kB5miQtGHgY2gRxwzyFeEXWmLNC/YPLtf0s7zThWz/pyBXCn7cAgjxY\nrTjcWLmfCGokPFG0iTl+qedaBdz1O5UNSN/RCCupp6yBn40VCCgT9jxV+i3Z\n935kwf6ySFaf0H6UtVSeUFB8RpSD2sWp9+3w4ThCa44HnGIokZpgLcVKxLae\nAthOCr8WS0L6x9MhhxwsmoJOSSLfZHEpTqbA7l/+b6aANza7T+nVTNxu9rWI\nOR08kfG+BzRb1yiHKSXayAATzscVhCG1Ui/Wwcjcj+FRh5F7xdNxfXdAChkP\nD06Bzg3JnC4x/g2oiBLNOFSt5qmYdKe825nikottjbghJj1zpeX4gW+K18rp\nTOfuyAalPkETP1hizSW4jJptDHzXKqEFbOWXPLN8jyh0auz17yPp8qr/Tqkk\ny5hU0FZk9nltPbE2+WHprpls4W2CDno1FMZ03Nxx9ablBqi7yvLDm2RPch3x\nGuEB/PUQNrd4irXFGsqd3pUIDFgElUXWvm+fIs6f3yV1PZ2CWkwSFhKCBEBP\nT6VC\r\n=+akT\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"38464c64f3ed5b79c0bfefe155dc3852b1b7b339","scripts":{"lint":"eslint ./src --ext .js","test":"jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-beta.6_1571678154258_0.9703554101935279","host":"s3://npm-registry-packages"}},"1.2.0-beta.7":{"name":"@apollosproject/ui-onboarding","version":"1.2.0-beta.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0-beta.7","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"72dd5050e4ba295bf3efa4797f073510c86c0ebd","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0-beta.7.tgz","fileCount":70,"integrity":"sha512-Pw30/TiabOIdN+KgdOdjx5zNskU4PsFriL0Ktz0BTcmjoaZxd/658rDttvrRukKVKsuX9QJmJyhVJe6nqJqQpQ==","signatures":[{"sig":"MEUCIFAu6DD8EJAC6vBDWHnf0BUDVVlUwhiM5woymvdzb2LVAiEA4vFOY7DaqWTr5Xkp8/fV68inpKRShuXDrQar31YGL/s=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":597952,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsK7eCRA9TVsSAnZWagAAmRUQAIj605Y9b0tiyRZqi3Ei\n1RnxxiIw/M1msB3w64SdtB9nCN/DrqQbyPQ1XLRejF9aTQFsaWkDs4Qglhxl\nkRRZwJdb8oGXJpIIRctNIiYSFQBJs8oXvnhP1EFbo3I5U2KdLdCshBsGhQmS\nD1PYUgtl10y3uhP9mu91b1meb1XqD2bqwJGHE2gUxxqbjAtHhky/ZtZFwqtg\nNgLEcNnZLJX6b3fy9gbrc2k8Yqlxoiw4lICp7rZ0FpzdyAr0aSotRDVM6U5g\njceKVV2gqSS76JYUccvd57rN+Ug5QwII7hn13YVAvwn3r3vCerZmLW8NVxBj\neYYxJfLCLI9w+d2qI5C2BAE2D4T6+KDR3A2a0O7RbEL13eWqxEZ+NfcfSWIa\nd1Hy6gQGfwGXR48ZlLhsJszrVyaNvpQrv2tsjVVfat2IZykaeDROcKtwRQL5\nxKRLWIACa0gDHEed6jxJwc1+uOYcQbQQ/1GF98xenIZBDvi53BIlabbD1Tor\nvNMGFg5NQINNf+t5IMKsnxvPQfU249erWnunXQ2Bx5d1YpP8ikwzegw2vGK/\nMq2C/Zec6C3hZI25InUUdNKYoUYmHVaSgCYSKg8H/fPVITlQPm7aemdf0GTg\nOBqjfcxmQRxn/4MU01zeBURkatswfIZu/WDnZwi6AVV2mOnlKZgcsFkR5Gsr\nLrCh\r\n=ZyEI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"073af22eb70e7f8f8be3f9a3a8197f5e586fb418","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0-beta.7_1571860190329_0.13265707137380311","host":"s3://npm-registry-packages"}},"1.2.0":{"name":"@apollosproject/ui-onboarding","version":"1.2.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"bbdd2996445d8a1c966706d0b9311e4fcf9b9730","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.0.tgz","fileCount":70,"integrity":"sha512-fzMwkEGp+LEAyzFxZbiyCz5g79wv3zryHwC6czDe/CMkIgpacxb/eKZ8MsAsVq8qykiPYwJ3wgL1sMs2o2eNlA==","signatures":[{"sig":"MEUCIQD8d0ldbtVaTvkysY+jF52fdS8GmVQ5Jp3XHIqjrPB/BQIgU8lLd6fElA40BLLteqBfjjlwcsryunXuz+JVB2jtS14=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":599056,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJduyCXCRA9TVsSAnZWagAAdqYP/1+j2hm960NEi1SeKlt2\nJKPl4kz7rHP9mm0nwaaUG0ic3ldC2LLLb/1LhYXzCgSwpnTfeYzTl5PFZFyO\nJGa6c8xpA0t+Rt+I+QiPyR+R5Iw+PoKgydqe+I/JliAcXiDmBWd+xeCHiiZS\nYd+Jb0vk0bFIwWNSooz9+CvoSxbVAs6M0WRJV2vk63/lw7Kq9CFnZvLArNRr\nsRzoLA+GLnvMVHqkHUq2GTx6bnU152qIPMUANJKpjIuFQtDCmXpWqYBH1eAq\nFWNsLed1FzpUQfMMi+IQibbC8L8A47YgYXSpW6Ea2pLtKSc3pdZWO5KdzrvN\nuGHPoZ9PjNuoTp9AZ/SXm7O6A56B4YQgAgmeZAUeM5uGQJ9cdnk+K2CnXlD4\nsRFU05aC9e+UO4jph1CB2CsrqHc9SOZCmP0GkV+JL+ACBcL9pOY1I4H9Uh43\nl7Nc4Ph60EqMvjTdIKz6ayfqlqk7k4PYSCCoBd111ey3xrCvIpi6zoEIDhT2\nv+75yd+qaoO0SPPsgRTQQq6757FBvNNVMLSwQg8XtCIS0H8r2x9kZPKBk87o\ns3YaXMkWU/0LG8oHqD390qXl1oke6/nt3v/MT9sAtUYQXfGbKa6Dq9AWGJ35\nIasvj4JdqmDyCMdzqaZ4HqVc4TZEkzMmKugUfaW4vZf+3HD4l/O9VPj8YtMw\nGZgR\r\n=dqJU\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"855e66f1ddbdb7170f047f5014124138b9abfe84","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.0_1572544663001_0.7576217782825649","host":"s3://npm-registry-packages"}},"1.2.1":{"name":"@apollosproject/ui-onboarding","version":"1.2.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.1","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"63a1487e0b03d73a82083d310f1c01eb1ebdeb73","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.1.tgz","fileCount":70,"integrity":"sha512-xGC2pwPYG81BrWC8CHkMBXI196hexr2+ivto/pJLyZZyCK1vzmQK8f7spXlCCrCEwVEqUpVFObVOfqmHK3aJLQ==","signatures":[{"sig":"MEUCIQC96oXzEuTrf+q9X/6TMrFgTqa9jYo1gqyjdtEfA4Xe5gIgNXe5fZZuY2vR3ELquiJ/Owo9q4UXcicXn7xZiHsVZqU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":599056,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdwZeYCRA9TVsSAnZWagAAbTAP/35SpAMtbTjZusRZKK/h\n51IOkrXA1ibcdbcLzMwBEWmKiJ1+Npm9QfdyL3DbcOkAWRdlnJgSxWRywbKx\nRC4fjjOgP/IMsFkruTWybBHkS/BPUYOs5yE+exRYHLN26/ojzSM1gQohE3Cv\naIN2KhYZUGNUKTGu4IUbw9HxUp+0sscUu2a3I2rLVJslUGzMpUCSZpsd3xah\nKXACOLkLUpYYAruN5ksseohe/SBm+Hl1Ux5ozIoHV/1UYunCp7r0PD7CdK/J\n3kgl/qXvwDYawuEds3IrUXzEtwDhlthQM1Yz+tb0AVQda2lEoUNHv7QC1g0u\nK2rN4xYcvMTkCNUXHVsEnGXdDNVhlFEmtlHvjWUYf0bH2/CJk8gG2vfpJ50Z\nHgcIHdmjkSgukDY46Nm6pk1WQVrstM7ii2yR3sRsLtjOQGzrTNL8qX2ch1C8\nbiUDNZKfrkUbgKVFAuRc8O7uk9sXgB6tY6FH1DLUR0ZMj9Gr+8apOsvI6/p4\n2ZcDtRo83NyQXFwjoSoEr6Bc5WsGoNN3BdJDK4aOnJFrM8eUG4nL7azpLpgW\nTaF0sXXom9pUD9NgsldWKjwQUioPJ4q1TrhoeJ478k9TlVID9wOxBa7Q/PzW\n0pssyP4br7QC1bE3/hlgNxS6R05jwOEbPp6d2FXJ1l91/9sRKXnuyodTXtTV\nFCBP\r\n=Z0IH\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"03dc63626795af82d86f1acf541721e83c929437","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.1_1572968343636_0.00917640121896679","host":"s3://npm-registry-packages"}},"1.2.2":{"name":"@apollosproject/ui-onboarding","version":"1.2.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.2","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"a810cf032d6a4c90bfac4e757b3b86acf3805bd8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.2.tgz","fileCount":70,"integrity":"sha512-c2Mg3s0gCZUfLP3mFGd0njBdf+fxY9mYQ3y37RrVqDkafhcl2MceriZR/oWSiqfJKIyNfWJQz/KBWlQ0N0kpYg==","signatures":[{"sig":"MEUCIQD5mbwApw5/ve6SL5b1PbdD8nWZ74dZBsHGiHa2xHU5CQIgMnDatQ/QZoLm9Pq9xrSyYhAkCs5YF7LQn49IfTeGp9E=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":599056,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdwzEVCRA9TVsSAnZWagAAvSEP/RVJ0UrUojtB6FZhH177\nCgYWntdRxHjk4CJbVlxQ7TUn7mlQOs6rkiu0rLr7Ofa6tFKJRV/Iv1Jc89BX\ncVBMg0f9XYFW2/lqvDkHlmn6KeRb+n4AaJRs0E+57DfV7x5X+Pb3QY/Mv8Xf\nMyiK/1RxXghiS6jw/n3bAZxl5+/RuBD/qa8VHlHb77hYbyDYWSAlWEwQnQAH\nCt3hgcrYyd/QgtNvLbJH1vaRHul80cCpYi84aAEVmjCbhxFD6UmbAMc+C2h0\nKITbrqh/uvzsvLJhiU9q4JVcPLlB6oe/wHQRWieQHCI98WO9KNT+y4AfmreN\n/ACRwr4lIKYAXwU6yqRK6j3sEnsiSwoeSk4furlQiA73SG35iTMGfOHrUp3r\nb54MAvM+SJQsu2XImoFftO4d5SVqWcHK8+oXqaDRh/H56xz7rQhb31SbB6iz\npfup4yL+hETHjwk0S4cz47Rhko0/8kp/8kQ2lJvGENnBb73Sg0SK+H9H2ANx\nPEKxpSNQCeDMo2i/7FCgT97uYDl9+KIKq6OkmF7eH+o/xCJ3oRyoFNLXZFED\nuxGNj/mkX2wNGUjdQwDw3ZD9SExTe7vzbxWRLO/IxFqBt+tQD10Z6S3kEK19\n5gkeCHlnR4rBUyOwZu4jFK5JTa1BcmJYZJBMzC/ikDElMfrQVOAoQT7pwe6b\ngQIz\r\n=4WrL\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"406b5c3333a0c04a21352086ba6d3a25b0a879cf","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.2_1573073173090_0.6843112112333314","host":"s3://npm-registry-packages"}},"1.2.2-alpha.3":{"name":"@apollosproject/ui-onboarding","version":"1.2.2-alpha.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.2-alpha.3","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"2935a03ca3efa88895514a28a147979313acb468","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.2-alpha.3.tgz","fileCount":69,"integrity":"sha512-IkANHc75cxySBx3cvXAll8J1upjCokIS4ynDvM9AKxx3I8glMHmANMVT7QkDRhiuDiC3H451SanikYNA3uJ5Aw==","signatures":[{"sig":"MEQCIB9PIVZbpsSLoClkw+0OawrR61SIgmpAgRhndjqR6pt6AiBwASFqaqlC/LEnN6A3UFJPGZXPHYIr0cJUxVQHLG/BMw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":592924,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdxDL9CRA9TVsSAnZWagAAxIMQAJVLkg8FLMmO2H+bqvM5\ndICK9q4Te0f4WXZQgXEdTfGOicbBBoBUk+OiJdQOCAUBS/bJ7BrVSSE/iyZ1\n+w5y3nQKmAQSDJjvqWRm2WIjE5ycQUNBvQne5ACuGHOsv97y2pd6BcD6dj6M\nuZMV6p1c14U+XfVK2xqQwo1aS9ZAmnYd/Kce2DnOQoWI3acljtenQWIpNfH2\nHn0yfUL/DgnnB+zapyeoNacqEwu8wo9VIy2D4e1tSoWHXkRywl4tE77mVnr8\njiOMOd3yQRF23vyIoojK34tgnh4WMM/7AtyIv3teMUjSLgzeyvYsTyb8m5lK\np+/2T53raW+jf2WJPRfUE/5KzWMKgtvNA3gmDbO454lYQ4Gfgf7hKXur2bJt\nLPc4p6UcoQeeP6hhP6H8s6d82EYSW+nkgCI2Yn11NHVXWiRKdNuOgSAMr7cE\nqRSKUnOI+w4SXMhvJxYdgRenmgAO+LGoNjlLKSeREjgDvwGxq/+Mn8tk03VM\nxTMntwXTdOyZkw1BKThXykjFm7DPw5Av9XPU18ndVesvGLa1MBx+eJBGOoVD\nj+cFLHHBtZADgRKK6r9ID4WpvW0Z18Ar0fwr8aa/iACXOjQrigINkWnOA2+t\nIgo78xpXdC9aAX7B3HxmKY6W6Y/VMk6AxOyvkYgQIlwKxHdwU2CVKFru7j24\nFZoT\r\n=C5sZ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"331a84b5a963c5bb171b7788faa202852f98f4b5","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.2-alpha.3_1573139197036_0.9834859400350124","host":"s3://npm-registry-packages"}},"1.2.3-alpha.6":{"name":"@apollosproject/ui-onboarding","version":"1.2.3-alpha.6","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.3-alpha.6","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"b9fbfc2fac71fb47185e7a20128c0498d66ae2d7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.3-alpha.6.tgz","fileCount":69,"integrity":"sha512-Ty0B2NxZKh6H5TDhU/kjjfpFlTQGbzneIOuecUZyV6/nP2GJnQP4JAyJSNT1ioUb+dYQM6xOHw+6Qh3Dk9o2Vg==","signatures":[{"sig":"MEQCIAp/KgOpHWNcd+y7Vq8ky3NCa6queN0rKnoAOLdoQR6MAiBmrAumGuI0W74b41WFYePLE9gg7BAFGREzWyS+/jZ2aQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":592924,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHg1CRA9TVsSAnZWagAAzqsP/1H9BxhmNTDzVV8upyZ6\nT8aPMmhRX8Ogc+IBn+BeKVvkX0LFPXlkyzRCMuyep08SAeeCILtYyaTWZkbN\nklnLcRJVgjpmTu5tuBlHHEJWni39wLl764JIUWhaZso5FQ3DZRhaa2Fo+UBv\noJC2301eHPLYOhBJxTcKb5IF5osCaqA7XKruVCYKDaLhZO7FjaxDFALmuCXu\nkpL7uQ+uQEirTQmZehKXNPGnq49wr2DyfDclpSN73tK7B+0MEuAD2rI+dNJs\nz2qBTwVYCPtjnkjhdYJ0T/EtCSQbxdlne+R3Nc0oIvBXWdqJxZGFiiLFnCpc\nq+yg6XW5nyxosnTGqIUGC3TLZEFDfbSAZzBNmUWAnRnrEFaAwxc+IR+x8Akk\nmr2Xrq+vAVrQFCOaZSqVZ0va6pUGJkRRb4AiQ+yId7PcBBj2/ygj5VCenSEW\nQtoj517skkFD3fyqPdXJLl3ivKUsGNRnHc4tg329VDw/v/upRzjYMSKn7t5H\nWdEzocRE6R7BX+Xp2dpjINzzUmQyhEz5J+SOSKjUChgkaGtBxVZszbTQsASB\nxs2VlJSriW8UIO6m+ZkuccsYXIyP4XFAD9pLObcIebuvexhF3fgIO5+V+C5k\nRFZ2ebD0MixdfEzuEOKLabCkwLG8nV4vfqLKf95ukhqBuGidpOsOv+4AZdIl\nbQDn\r\n=hvbd\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"034c378316d7be519189031092da0204ac052bef","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.3-alpha.6_1573419060724_0.7869969578345468","host":"s3://npm-registry-packages"}},"1.2.3-alpha.7":{"name":"@apollosproject/ui-onboarding","version":"1.2.3-alpha.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.3-alpha.7","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"d174c6a24194532520cb09615b882ee77132d196","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.3-alpha.7.tgz","fileCount":69,"integrity":"sha512-8lz2gzh37FWrSytBs0EdIB3dDqgir1apzzcsmPET751k1k6AylPLCw01zhGvUIhATrTdo78nVOrJpZeRdKqM+g==","signatures":[{"sig":"MEUCIQCqEMgjKwTb5DxnUpUBTv+rHqtGSKMKnlLq1LI9iwWdrQIgFL6ieDpUsdSORVEOhsupsFMR+0T+SeTdX5dSX7ls/q4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":601608,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdytXNCRA9TVsSAnZWagAA9mMP/Ra10dwAllgkbSddgPd9\nY7lNwhm5M93CbuwuXFdMhwy6XLPbbGnHMr8sIaLQ95kWJZYQvj2W6niNfMW/\nT9AOwMtghE025tX1GdEJ2oDGroOJkLtp/i4IhvdyRcNLXvM80wRtJ8BUoJ0r\n86Hjvv4L1ZIs2OfEaf8liseU+K5y7yX9aflxBqO7PtUALvDMdYGcRP+XmSEZ\nOee/eN+jvxKDOgfD7FjppQ4nx6yhiFP8EZ7cs/y6MCsRPb9mvglxDt7THBqE\nfG/Yueo9hdsaCNobXmuensaakewPQPSagnvV1D69zarcP9rPtIymFOEfGSNl\nO5+kX2IqGMarhIK2lq4X6izr6xsQ8Iez5zNt5bH1H6UrenQ8mxBTpVH2BPXr\nJIk5Jp37/mg//8Dq2yVMcZuJqKwLQksh/pnbS0Ul8L5BxaNLG1SSkonEHEgr\nFAAJSSLYQJefizywBebrukFQiu6CcFC21wQ8tz4Xmlh7i3MN4z4fjPDEXQ2v\nCUD+OkxNPEIsMOmph+5nfBVF30PjpuZo2+dBf8KUkJgpNGcG394+BYlmH/Fi\nkTI07nu+B0zRwKlsfbcfjRFPrS1V0EjCB2jMPQnWcGMKwvR6LYQgM+I8j/s8\nAcl5ymFRL3A4mfPsO5QVYa9uuAXXfiqdMfyXeOWN1FFt+pDU3JwmyAbX412c\nHswu\r\n=tqpo\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"978de2464652c3fe29098a380d7e6711630049a8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.3-alpha.7_1573574092729_0.03691863420853192","host":"s3://npm-registry-packages"}},"1.2.3":{"name":"@apollosproject/ui-onboarding","version":"1.2.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.3","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"369c13bb35b80eaca6eefd448f0be588e6e2846f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.3.tgz","fileCount":70,"integrity":"sha512-J3UrEXb0jfky5u+Aeu/N7PTT3i7GVrFC4gQBieuDTeodY/WZHSkF8voxosbk6DygS8UZgSjLGf4ORyY78PHpcA==","signatures":[{"sig":"MEUCIDNA9DHJp9bp/1w974jj/kYpoEKmz57bUmeMbnmx18X3AiEAgcnTsZuuo7h71AabBhM6AKl/4FGHHMc7h5YbhYGZp+I=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":607740,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyu7vCRA9TVsSAnZWagAA5z4QAKKW8CUBkalosJ4ajP7Q\n/fQFQY5S5iFJIqI9TvJGWLM0Q5+pZQQQ1dBcG707NCAae9FfY1sZxafUqWS4\nMAulG9F4XfoPe8zpRDVsjYKJ+/6eouK2Bi+Ml4Jkvjoe1tpU3RjpvPj8qWjf\nAz1UlxzDADnfdjzZeDQA/GfDfhKx8S9iivd64wnHmhzFrZMKAeHDwc+3TTBF\naFBaQ8sR2NZdx/g2Ix2x9+0rjnfTJVWcYSRHXnF/r/RKjusHDkTRvA3d9uVR\n16qQkbEPghYE4u8IKnWNZpVgiGlZNZfv0mz1kYSUOQwN0Hw5kMHq0A1vfY77\nSc27ZWpANMrI7svn5oFS4V6NhseYT4mHltegk6gfM+YwnwilVrv0pBIy77wX\nhJRx1nw3VJJ6jLcYdRF4e/1T9bXSZI0wYWpxqjncsMcFCnrmqEbMJfwvfSbw\nmqbDXwXcTP3UTNidgW97dlcGJxampxUTMFUIf9A4t80+KZITQOEwsG2HJRrE\n4dv2EmavSdh8RMMJUIrPeRGbJv+gXmriAqsQdqZ5cPq8VUIQdAv9KxFDvtI6\nUPS5sYU7b+edkdMcabnPkVHickvW1mXC2S7XbO4mO1fpLvEof1Szeh319oqg\nDtmjW/CpyMzayKDjiKOLY4/KC8/2BmoS9QbTkd9U0ocV38CMLslEtG5HDDGg\n4urI\r\n=QoT6\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"9138069e8c05dfcf14843be0ca294f34ee3deaaf","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.3_1573580527344_0.43517723840854994","host":"s3://npm-registry-packages"}},"1.2.3-alpha.10":{"name":"@apollosproject/ui-onboarding","version":"1.2.3-alpha.10","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.3-alpha.10","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"b5721b037c9587913b07514789791caeab953e24","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.3-alpha.10.tgz","fileCount":69,"integrity":"sha512-I0hk2MHJyCI0E8nHSfaeIAx+gXebNJQhVwhVL/7n7sevuvhRgBmiJn3DqYihRdJeJDB5HVl2mw3HmecFZ+sM1g==","signatures":[{"sig":"MEYCIQCDP9GEcTD4m1a7MdWQ/GRLvsawshF1w2tijijYEhO/6gIhAI8EhiCHOg4L6rPnHqd+9rLC91g3s/br56BBpV4hdSnx","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":601609,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdywHDCRA9TVsSAnZWagAA3D4QAJZc+2W1UKT2WJcg98xP\nZRX3EXzkmCPU/gbkwqHWSc7z6U2sb4D7+8vlQ6S1u+/yHBlUXVqQK0dnLVpf\n4hyrfLiBd38Du4pCR+1pgDd8Y7uMEyZSw5YlitkOADqH2AeT3GteiUovTU7R\nEIfMgLmkIDfo1PJOUJdI970lcWoXo4OmmJ47Isrio4CiupvViRqJ/BKRJBRG\n2X/fCWboaVtW6cpkGEBEumT+I6yPxOYDez0h0iaCPqJ8eeaUxAx++6h/Z4ov\nfddGBJUsrqhpTYjaYk11N7uPAGjlfNNGuZPZHNpPdYofEFmeUK/D9bwDPbXw\n1W2ZY0MUSl2Ui0njsC+4syBc7heE4hSg8QGiT/r1wHN5Z6py2fWln10nvhSJ\nXmbVjIJYgiJCJ9DpSVtATIIuCCYxGA8MYLBqrFHwPUqjmJZcMdnUMH5uwszy\nSM7BjQpZE4SUMM/jYjn+/aYSe2GIggiWx3G4GKxDlr0SCkygehFDS4sebblD\nnc35jU+90Wxk7vmEfsVPUkgO29i2fhNMUCm8Xa5+GeUMI/heazsFVgYPVsVX\n8YqMN3OvZtOEQgKT857zXA7Y1TShK6XNwq7kduPkQ5iNxvXHQYb/1IheHwHO\n25UA5bO0EgAkw4mk1SY3pgWky4bgKrJRaFM8wIJiENklNKyq8OyK+vkhUldO\nPyj3\r\n=Sfnc\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"a67149ccd0c61f6ebc6471afc1fc7daf19791491","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.3-alpha.10_1573585347152_0.023960750144582876","host":"s3://npm-registry-packages"}},"1.2.4":{"name":"@apollosproject/ui-onboarding","version":"1.2.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.4","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"a465e87cb133b88de5492bef47502bcc089705cf","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.4.tgz","fileCount":70,"integrity":"sha512-AzO81sflGbJrrPBndyQgM114DjcjJN6M3ZJCmoqxNw74bZjCCEgFrjef3n5qihHjd53rNsIUe4zxVSRsnFtu6A==","signatures":[{"sig":"MEQCIDGkzL74dKYDemHnxYQGtJJEQB5kuBd5KiXVvJboaSUAAiAIroQALUg3Smh9vngtXVQaEkbg2Nx7Sib56DsN5qOi0Q==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":607740,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd1cVLCRA9TVsSAnZWagAAn68P/i3Mu5ZZyIXRJnKfg68V\nsRHhm4yIvL79BqvpWkHwf6Uh5C7wsS/e2bXy4u+xO2FO7gMu0BReYx2PpXPA\ngU3gPWkrqqtr3fAWg3fzu4yZrfKXKOBNy72XcEyAofY3+Xr/WgU5DjFC9ZiF\nhiRxbVB2zcD14l/+Q8ZQKrLI37zpdcb+RXK2raikKw8n+ic86Omg3+P8mciB\nI8yHKl7M7Td7g+P+3WacejSH9fL0eJQmUAT50HfSf4joRFpQlegquynV2jaB\nCdZSvnEwe9EIaCNnhrqlB5AfA1IuxAPPDNDMX6Ychj8d1Gd2s9u1ckLx8iyw\nV4JsCGQIfEMk6rDtLQHspLK6lQw9gS/TDNk1LOT1d+yqHymm/fK+2klDnTgp\n44durWO5mixt43gp3Y1x9fIwMfbNHpsBoRRWrnrGgHunN/cywl3/YNR7z/yV\n8/VWtNDAYaE2d4U4Nx2BBVj7MZNAcqHZZj/XMC4CXVJP2BgO8o3LKB3YWwu6\nAVxMnEIzJ+9OWaGIhEF3XA6rhMULvKQpwOJj2hcD8J0zA0JLBCE8zy01UV3L\nsJt2ei0fVyM24xXDIvsd8FTnrndPFvbUUXd9tH411SzLvZNSJLTeK+ByV81H\nDDiAHQhjlwGGoHgKxMjhmYrvcWo4PTfnVLQfUvCsDN3KANOSdkAzfQDchvbA\nyn7v\r\n=BRdu\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"1e867364d2451db921c3716de268431ae7783e90","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.4_1574290757211_0.16116308316000683","host":"s3://npm-registry-packages"}},"1.2.4-alpha.18":{"name":"@apollosproject/ui-onboarding","version":"1.2.4-alpha.18","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.4-alpha.18","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"6603f11b3f868cc2e4df678a924d52836ea7bf99","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.4-alpha.18.tgz","fileCount":69,"integrity":"sha512-WMar7DK3MiZavWY5aFrdZ+aKXn8vPPP5VTrr0tKSLnJxghALMYFmGToqWVeJ7iaaJqczuGV5JfrFg5//OtbJUg==","signatures":[{"sig":"MEUCIQCtAMN7l2l90RfCv+8gHB/r6esvnEzTBmqNs5u7Su6i/gIgd4gZ83UnDMJVUb7RMb4no+0lkpXORGAg4jTWN5hsz4c=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":601609,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd1dwgCRA9TVsSAnZWagAAaTYP/0t2KjqsWQfykaAdHJHP\nsQ0pdFwaZXBTRAaHcAJHiFN0BbG4b6vtXzc7F2+ovH4Djb67k6peZzhYjHO4\nIR2rmZ+4vHxsFZ9pEc8u5jRdDIPEIj5jkiOcqPSKcxg7N7dc3J2nD+DyAlIc\nFR9MKv/ZFsPa6kGtUgzoKo9CRJi/J8u/YQ8+KK6EMId4E8Ye7umR6/NWpA7c\nMkbcarx28rFYrrg/qaI6j0bAUIckgnQnvSuXA5+fwNn7+sjJg0YGN1k3+CV0\nScaSRYXwW8HqIhR761DAYmkhc/eB3xyZIly+4kzNIS0Ms3Q80Cw16eL6C1+K\nGkSu9YFN5dzQZtrVjUH3dzloDWYrb4flDM/5VtebcDG6SsAabUgVKH2XpTRZ\nPCLvhVRxBMu3HnQKTxVsZG0UBJc89FmG++Y8KkQAIglKcb0Z5RkM6oBkv5/+\nJTTHLtEN/ixtgOdFXUinoTifI2wfA0CBg368JvMUmkTwoDK7/BZVnbOKEvcx\nJjiKEU18Zg2kGb4qdziluPUtcJyJjPtVrXA6ZiI4Tms2WaujCJwpOLHU9yYE\n2tIcUb4atXQJYphshlIvivm/bQbSwu86sTohLqjBBNBSdEcJsayUhxi9OBCd\n7DGuzKmZaB26t/PnyXEoUQUsrzgM+To5YSbx4ThJWxLwtBLoDqb4GqfQZUcn\nGpj6\r\n=vnUy\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"5cb2cf33fd88afc707c4515547a2d1dbf45faa98","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.4-alpha.18_1574296607975_0.17479239683333514","host":"s3://npm-registry-packages"}},"1.2.5-alpha.4":{"name":"@apollosproject/ui-onboarding","version":"1.2.5-alpha.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.5-alpha.4","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"4cf946303958e1bc83e12066b0710637d83c6f7c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.5-alpha.4.tgz","fileCount":69,"integrity":"sha512-TfSQKhW2OUqzlWFgDu3YB4GyH+fpa0WMz+BBWZcgP44Qdne8jy/j9tf/GQYc70TvtLd2xALqwvKQM/0Zi0xsLw==","signatures":[{"sig":"MEYCIQCtz62WHgWITmCQp45wAETR5UGpZqyUwIzSHyH+HIcH+gIhAOogJWMAwTOsAS9EfIHwjZLETBk38PPSivLqU8TxeK3Q","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":606675,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd5oO5CRA9TVsSAnZWagAA/RYP/2WLxn2FIu8KgL8n3YtF\n3YdnRnXbYxQQkc+2QS1cNcaPn7cNP9RF++LuDPvrnJmwGZTuC6LoAlIHjTdx\nPf6AAF3YubGjBdvol07fCMjU9oU7cFsmwL+G3dQbz1grvjzdSIjB6KuXc4i9\nDOTyU9th0S00jqCYczH1pbNfPlQEEOtWCHM4ojN1L7wuOiIvAishjj0YRrpA\n8h39oLdCi2iOP7fTgdVAghUDCe58Gq55Xm5zLpuWNk2wV+lrHtUZhs4WW8vB\nPoJOoXDIXH4WcaSzrzZLeXwtPk6sSv+q1lNxn+xHtuiq8XgyVW9zVdQ/ieGg\nU7+YXPKULGwCRMinYS4dhIOXScivz9CnhAqXFDyH7NteNSe8FTv6tl7D+02N\nukaT3DH0gxBgnN6vsSjp0UMyDbvlmcZbWtFp6t3g++35t7JmThxYgH/xLS51\ntCcVDQX4RVupGCjrPK72SNXax/02dmiPGAFyw4YpLvp0AG703Ux4F0qdZQ0d\nCT+g9TI3V4ixd8E0dP0hpsm2QWcVd7t2vt3SrD0ONFsa6H1ETTmu44yCXj0+\npLLVi6XsHdLfCtG89v0zvRdZNb0h9S6R1maG+fNlbYY4kR3PAhcvvi2E/EwV\n1ixb1SieK8eGUFjcs4SzlZSk3AMRBeeVWC3vq6T15rhnUVWM0GGqrzpyQjPq\ndOhA\r\n=LNYJ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"d44ec6ea95765dfc864a29167329a7b9f0a1e8dc","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.5-alpha.4_1575388088888_0.7839048555498827","host":"s3://npm-registry-packages"}},"1.2.5-alpha.10":{"name":"@apollosproject/ui-onboarding","version":"1.2.5-alpha.10","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.5-alpha.10","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"03cce334242fc588b74294e4c539a239bd8fb7a8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.5-alpha.10.tgz","fileCount":69,"integrity":"sha512-mo9hEFStiOgqFto51S6bXM2ljawz43wzDXu9SiJFI7BPslFncWfH+xwgimDoiHhW0xxwUeMDbqDYkRKk3RML3Q==","signatures":[{"sig":"MEQCIBLt39VJhoNd+8wnYfop11QG0iGdYGpwOWWQXdexZu1FAiAQ7fYJlIALxba5/mtYYgoTmI6hBRtXZksjPJvWaGRiUg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":606676,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6rytCRA9TVsSAnZWagAADO0P/2nHIR+Vlw7Dc26jeqLV\nCfSpANPVA8xFofXteMBljN1aSWgI4z0gbTSupQ/67savoFAPtBDcPyHV/RrU\nv+rtvDROLaCNFFkgFU4Fzlvbk2GHf/Wn71KvD//Su3QvJcq79vQ+bO+kxw56\nFcANavm3s4CHuvrLs7m7mcEDSvBfwB1Jacoa7WyshMQ/MOOwMZZJlQKpX/T7\nREjh5XNU58MkMsMbkNASfzfgF9xosO/eRlBZxz/OFe3T7qJuTVgYR16a0QUe\nX6zdyGcsvmorsCsoKN0C46+F7RvDisAYSNTgzwtM/+rQfD8andBio7YqfaN3\nJSebcHPX20N92nlcUkdjDVAbqfW5HyjDVj20hzGds1Whjb0In2bnPdWnfWub\nQC053AmIrBrKYyjiUY7Ku5iHpA5bvOm+Wcm2+6a56RtqriskLl2DwWcu//p5\ni7MUrDjgvM3vagGNfmwggZ3b4ypnsWwe3Mm2th4dzsEStnufSydDVx5IlHET\nMzsgMygAXeQuRl3U/ZK2g1E2etB0C1Gv/6Ta8r+qfFDDRU/tgnj1nRNKdms0\nFJ6S/G/P8pM2qr5EqjfxGv3P02SoLayctmtjeJ9+XOb1SXVhbB4SRm0FlF2D\nLh4G2K7HDTSK2jnT47N2uBV4NzFb4pMNPIaFul7qjCxaiZrTTKcEjaqN21jT\n7qvw\r\n=m43k\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"c5a25dda436340298660c14e4ad3359c43fd16e6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.5-alpha.10_1575664813174_0.4328393363277159","host":"s3://npm-registry-packages"}},"1.2.5-alpha.11":{"name":"@apollosproject/ui-onboarding","version":"1.2.5-alpha.11","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.5-alpha.11","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"fe5061bfec0f9724448cc217cc61703d1404b4b3","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.5-alpha.11.tgz","fileCount":69,"integrity":"sha512-iStb5rVjtU4Fr8nY1GHK9Glf3R2ASfByxVw23quou/+4IBQqZ0+vADXXfzKw4NbptpUeLCwnam0KqEk+JVJPaw==","signatures":[{"sig":"MEUCIAaX4v6PJIWyVCO5KYn412kiIpcv6jdjoMiJFX0591b2AiEA0SqiDjKeJrEVECL8tQCuRIHDCQ6pO4TPzOosTfeNN2w=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":622291,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6tR2CRA9TVsSAnZWagAASqEP/0W+ECL0dyflO607aDOc\nNIupKhRY/IGPBKUTw/mVZvHU+y+DAF4xHxmiKnwfNLGFw9cXuAXFoTUUh5gY\n38j2TOnPjtNOvc0SQ1gcYc+OoBFbJmjEyGI8uZiaLgcoLv5V91F97UWiLkKR\nLhxkxzl40lLBSIbSH9G90AFtYm1RSJSygtji9WQt984Am/anRBBs/PhuwyCM\nEJTJH4ohnv3jvnI1xm0CnV0+jSH0MhLsl3iuTb70jUEur8bhRIRRpy46hjzB\noUg9nxkjiPW1cx/rm/DmzcFT05l+u5uNcz8gpWZZVO/GE/wuBmRTViQtg49j\nnW/LnAZPhRsw83/Y4B+w5p+5FnEJgEpH7DRkGA9mreal7fG07YQracF1L6bu\nrCivfovU5gSJSTyFg/4TX4BRZkOQ+rPEZBkTzFYr9zSyC6JIRiGKiuuVBPj/\nSqGHIxECMDMbI/y4XCpLjg4xgXn4rPpC3QmI2HnrJACCBEzPbxlT+zssSAU2\nXcvq+8/LYFbWiKLh0C5XBshStzQS3P+dbSGmaXePshG1r6SHk8ZdElH+9HjR\n2Xpb4rkGNdpWsyLpJqOe3VwyLOUDOtL+hUO8+nEyvMbbIdKaLds/1sCI5w+v\nsDoli9BRYlDVgb4ErrczhloM++2E0YVw8F5LEfHhGUyuIhRbYkhkYDgjwqTF\nnfs6\r\n=0TRW\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"b7a6c952e5817dfe26a6b22951c14e93635e1dcf","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.5-alpha.11_1575670901492_0.8163688916114598","host":"s3://npm-registry-packages"}},"1.2.5":{"name":"@apollosproject/ui-onboarding","version":"1.2.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.5","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"6f78b4e404e4ed2bd9167952a805fed8236e0a6b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.5.tgz","fileCount":70,"integrity":"sha512-pGGJAY4fadxPvrzSaaCGSPMqoxNRb9UFz2NqNoP8aHuBBucOSb7+XVSQD+2jSUyDFO95lqAKO/cZTKG/XwYq9Q==","signatures":[{"sig":"MEUCIQC3f2+QJ0jEmdRrbI8k+hDOmpxU1xJ1E8yYWRkIsifoBQIgGZDSl54AHbIPj1sk5eQrYQ2v32yD6ZY7OZc3Ouy+nQ0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628422,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7++oCRA9TVsSAnZWagAAchsP/A1n7Yt/7EJExHrBcW3a\nmxtbesVk0F9/xgEoOQZPzpv8zbG8XKkoZCZkGEogjPOSSxu+vP71yTnEd+yI\nh/hcYSZTpg4uQT2ziBhlDYuW0hEzcsXqEhMmnxf6kaZTcgZJaf9G7lAT6eB/\nTuJd9jW4/jArXkOqNsdheykGbILPatv+liThpxe+Z7ZBqBe20s+mMh5rX5j6\nb1YmmKDh652xCGmrPkM7sz/hg3fNjGXqleIsxpJdd0Cpvx6Th9NEHBzsRizl\nhNyFsou9jVKQvp1kn278ByYY1ZjnUG/jniqqXefObhFfbNKiix10G63fU9PI\nsC83P93eoDLKBGpXKwgNkOQwmOKhP4XVAxjolvEO9FFL0lzRq3XJVTkR+s3E\n3tKYA9wiFOrsNYrzTKKN69H8Sdk+LIMiXKI8u/qDtcvv/GBjcqTtfQh/EOpF\nAza9ja1muwwHpTVHPF4sAPWyBLmnNswJ+kuQzom2MxzPbmiuJ49ETiCw0uOP\nXa2Ac56xpll0FKnM1PoHpKJz4DoDvkkZMmJ+e06VpnoPsACPJCgOL7QRUTGR\nxXJd2DEzALm6ME2/f+qC5yzWqx+ZrfG2NLc1cT27a1BWhweQdrzFJelWJ4cj\noE9AVGyrpJxGz3mkHHP+IP9mToVEa0TelKwExjO18mt887FtpxY2xj7bfbyg\nBT8N\r\n=u01U\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"fb72648f5eb1f33cb594047db79d5c025d47b7b1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.5_1576005544039_0.7592456383640562","host":"s3://npm-registry-packages"}},"1.2.5-alpha.12":{"name":"@apollosproject/ui-onboarding","version":"1.2.5-alpha.12","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.5-alpha.12","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"ab986af5fdb2e4368aa63a22c42063c143088612","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.5-alpha.12.tgz","fileCount":69,"integrity":"sha512-DeGrSUpZOAs3HCuobHEGx5j2zrgfkW4FmggUxWpuEijt1pEIDOqvZ/4DbhIXEe+X6XWS1a3LCG8wFpoy8kr9/g==","signatures":[{"sig":"MEUCIQD4dTtb8R438MlwYyqQqzKlbPpNDNfGg7d4rfpAjSbhxwIgBNanRO+D+k0bj9MYb57iUoMA+dZe0ZbTUeFp6iCQ1Q0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":622291,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd86VrCRA9TVsSAnZWagAAkn0P/A7nzNo0FZcQ0xxxDF2n\n2WNk09kR0vH2gBX3qra5JEtb6+R3KudEHnuHj+dg2rQFKJevcunG6QIHnPk/\n2ChT056fDJFazdtrkbD0+2JFC6O9f0gG1oTtaoh0x6LjB3JdXV9bvAymMicH\nkjgXH8b0FO5iE5T4BpVsNviayodCJN5pcipWs+TTUhgy5Mmy9o8UdxsQxj6N\nYClZiFPTVXUTOYm3y0EtpMREnWG2Uoc9610qC3UzXN31TbXN05YP7MgJtbtt\nrjgic6a0Gvci0mHQ2f1k5/YOq2wX/HydYXJCnyBgEngF0KEQZO/6As7mlCPb\nSB1P3wsU7bsDW+WVEAjifhCZUoTRYAIUx74Ep0so8o2LBDZhSKXjocSh/Eqy\nGej8lIa0dy1Ium1GnBzKa9Pyl/RwN5/NojB/EghvKo3pCoB1UsAQ6ZTXIEoT\njGawjA6k67si8LecmhUwk2m38SK5p2/FUX4OlrvuJiC2/X6CzDPvJvMMqvUO\n3pPl8o/lLhEW7iTSbLx4gMgDRkgOzg61zIW58DMHkCarEjFiAyz4Jv76Ua/5\nA2e4FJgsrn8rLoq3eISeiFeQhQBQ9YcHkNrjVGZSW7mxKR2oCEdcM+wOFNJq\nJnzNEo0DBQWuW0jm4dmJZagjBM6iD49Xb2kTud2VT1boceyHOAqZETCzOyUP\n4pQT\r\n=pqnV\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"eb730ef769c21137ef33b229b2598cd2f52b57d2","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.5-alpha.12_1576248683148_0.8470973725651831","host":"s3://npm-registry-packages"}},"1.2.6-alpha.5":{"name":"@apollosproject/ui-onboarding","version":"1.2.6-alpha.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.6-alpha.5","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"1230099f2dd69f20ddea2614a8068658f8a03177","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.6-alpha.5.tgz","fileCount":69,"integrity":"sha512-UqZIirWOFyVADvcpgv8M/YD3CSllUijmcPxcJ2BhJdn0SPCD+b6a//ijWjaEj+TqB0XkMOsASkqQATUjmNXvQA==","signatures":[{"sig":"MEQCIA+BdOrmQRWL9KbJD+sd+c8Zj2al9IH6b1ZsTYXzC9qrAiAjdzYh7i8gFjnCGP25DaIB0FabWGXZNpcMgf8GhlgGXw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":621695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+AxaCRA9TVsSAnZWagAAYtoP/06JD/IM2rq/vsMIiO5t\n0S/rUIzztRPDWSrL+XvCEi++AWe1HKDHiyfXA9HvW+asktVRdByCcXn3JxAL\nh4/APKilEaMGELC4GL6iUvfxrM46H9rbXqcIbpJJnbmuTZTSx0/Y5gZp+/gA\nCsokGw6twBUf2kAS1GD3bR+pB4fVEnv5cFZBRWGy/AWC68Nm3Zymz4XiWp2e\niwuxczkGLEZhySpJBLMOVckR3P7n7xs3IShQtqY2K8swUkqi6NklYU4ZHqYY\ndPXfbrNuqZfj/cZCmjvUWeJKvVd6D5Q70P273wgYRGKJHdaiKjHokTHEBFda\nSGt0LnDWuMX+aDz/7fmvbhmWZR+KSpdD2mD1GCK8YVtOFAziJ3krxPmHtnE6\nCd3T0jmFIw/QjU7jrtMi+F5sqCSSiT3+W/SdN+Q0yyAtMMiRpollY7UwHZOu\nGGdjuY/3mZe4UWL4fvRi5oj1jaNMrjS5P/k7VW6HA2dZPqU5VWfG9VYSxiGp\njVynAq0W7dLmPL+9YvanTUdJDnKEidNJ89RoKvmOBb6b3Lka/d6PKKqdaeZ6\n0vb7J0y8l7hwJG6ZCB7hmwAOSgctSzvuCnuzPI5FWTreFsI3/CyP5FseKA7p\nkZWMKuA2OIzew7IT7DJP4u37fGi3LKy/HzoQNP1dY7XuBk7ThyA8nqGwZt5z\nR6F3\r\n=N8Ha\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"603bdc17f4f5734e4c16286de7d564080f7fa133","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.6-alpha.5_1576537177884_0.6950471142362042","host":"s3://npm-registry-packages"}},"1.2.6-alpha.6":{"name":"@apollosproject/ui-onboarding","version":"1.2.6-alpha.6","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.6-alpha.6","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"e6b693106b55b79ab660ee98e606819ac5526d34","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.6-alpha.6.tgz","fileCount":69,"integrity":"sha512-qR9ntn9SGz1Xqa9xbKYN4Yy91poL4506kKDRR8MZlt8Bugs6n/XWBzNQ7Mk6+GkMOZ0x9JUnH+FPESYYmAlZxg==","signatures":[{"sig":"MEYCIQDg82jAF0/3sBu3uBdQWOJjtAAHrS0kHwiaLRGIX1Ml7QIhAK+vhO+YfPU0j6c3LoqDNgsQe3UOU4eKVOXte5bvrebo","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":621614,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+kJ+CRA9TVsSAnZWagAAEpYP/A0IqtFa9n7cKylVeagX\n3Ndtru1gZy0GctE79pFhVBmbiHhGdqQle+w/2JFlvXXkHKY42EvmheKFFtVu\nJ0pGieT2GG6NAbhVf0MVObfEyWSd58RJDwfli7P/XdcZmLSyCM+qnxN6fcNH\noqySJ7jVUUYKmHKNhvU5DrnjkvNXcxDdXPUcjPTLEkhV67b/xjx0hSAmU4aH\npL2WLbShCo6D7EQxgwZobbFUfb6k0ICPrPZMjZpCAjK6nS72VmGEuLvabj/5\njLyxqxBV3eI46TFrlzONh7ADDL7EQyS4BfUtHBo8CktmazJIUzVEStKJ/Dlk\nuWPP3udyIsh58uPm7bo9ooGKoLywA1yQmEmnYvlHeLHzIdcQWd5wzAXjC0TF\n9J8htK9Y8jUGwvO466oD6Rmb5+aql4lG5dVuJNKzIPYPvQe1/ALIWH6RxCoG\nVc4H8MiMXliZAl83d6UXMtaZtFwgeJ1kqZorr+t4aOCjvSl8T6pdEK4xmXu4\nbW73/6w7cf4F9DBp/GfJS8qFWzsjXP2fIP3gS7zDftFJVQB9vwihtMXcI+X9\njmkwb0R2uyu8TrCHj8A0vb/yizyOo44d+XLCGCcmw4cjao99yXTGwbCl9T0o\nB/gHcSGZM6znrHo8RRU9fCpFSchXodMyGhYQIEiKD0BVkQt7xJvodramtoa7\n01YH\r\n=0rmh\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"9b4580f64065dea29eff7f2df403716069833cb3","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.6-alpha.6_1576682110205_0.026052329699135734","host":"s3://npm-registry-packages"}},"1.2.6-alpha.11":{"name":"@apollosproject/ui-onboarding","version":"1.2.6-alpha.11","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.6-alpha.11","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"b615e324646af5e81209aed15352f644d059a6d1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.6-alpha.11.tgz","fileCount":69,"integrity":"sha512-7E5DkDb5XT3MAd4kLWsd0/1Ic8fzWmDpH+zbQEPuUymALTyMCgI0FBfo3C4QHBM4bXksOp6cMZilvdILKP9+TQ==","signatures":[{"sig":"MEUCIG4R8KsARQWpdD/TWaTBP4JEO7c5mIZJn52NiSGWHGbLAiEAqR28K7eklKV/yF1V7FV2BeriIq4tLyBr7hM390Ugn28=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":621736,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeGOEwCRA9TVsSAnZWagAAkk8QAIkglh/TUzFiNgClOt2t\nk+wOg6zisFqMpbgC50CR7GbLgcEWrtrOvI1iWPLOPozbXN/mHQZeCtpQs/eI\nmlOYBhtqzloLZJonzipLEkvgB4AqsL2csukItIhwzwksEPE05nDq8LifQVgX\nPugHKCBA+UzdDX55eXPbQ6Ucg0OpyO7Z4M5zEa5bkwObncJCQ7zweqFjJ0kn\n6NODBkF16aWJiwE5m8WhU7jTOLHgxk87CrGS5W1OBT8GK2zMi0CMMkg9ILnw\nlVLrAeUF3Rnii0Q3pjFEJGXr1xaS31riFiFsnbjODFPgyEo1lWWZomgxwWtt\nltq9qlCWvEBRYS/M3eVDV29VvIMfyyQd01BgCNKb84bhSqFbzSpMpLw4NAlk\noCpWp7V/OEn7Bh2Ah8YHtzr6uPdkIloAj1npe6+I7or459qHl2yp5CeJH/V4\nWQ6s6kUg57nq+KbdSUp8qP8XGKSlezG72nOXySka78Dd/OltdJxVimzP9Noq\nqDmc9DJI5SSVzO0+BNbguWdwof1YRgJeFMaDL7H33MJb8giTwRx3h6bdQNV/\ner/6ePTGFmVrDJ2e7ze8StxWF0OKySILWm/wuQl5wQ8KEVzk2UNP8Q7sJQE3\n98NPDv5EPl2I5E9mMjn4+uhJZkfjsTSc1ImT/2Xak2Ol3Jc+VH8KiAJRJH6j\nvi7D\r\n=bN8/\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"ce6b9dd9f0284176b9e0bda3ba98da0c5897864f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.6-alpha.11_1578688816011_0.7409449346311019","host":"s3://npm-registry-packages"}},"1.2.6-alpha.17":{"name":"@apollosproject/ui-onboarding","version":"1.2.6-alpha.17","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.6-alpha.17","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"de992654e05a4891fbb70835984d4f6decdc725f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.6-alpha.17.tgz","fileCount":69,"integrity":"sha512-QolTxhLi/G3lAnht/qdqU8GoBhYoJadytE4VYmnPMCDJjbIMtRaj4LsBLuRJ2DD2Sf0a97Rdy6oP+jv8eSmdqg==","signatures":[{"sig":"MEQCIAcLQjnTenpDTbfKz26Y+6nI7y5zmVHaHwqNdxB+Ga6MAiAOlfPHdRG80EYHwLYqxKRNaxI2ilJFODsldHf8ldW8tA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":622380,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeHy/4CRA9TVsSAnZWagAAlBcP/RgOLnSA0/grw5BorFO6\nvlUOxLsfxclDvApWVaVZ+ccMXaa3uEl9sScNLlJavJxjtVqjTj13dlkpI/9V\n4U58vzb7z3yfvnUv+Oq9Sjq0A93NFtFEKZaLRz6fCzGAYOua1hHx2Vpattsy\nYcft6S+xAxUn+w3DJjD2C5Z/90zdqUxXDpfcUoynNYBqrsdS04t/W9LvGtVj\nJkvhXaoIgHe70Z0rOQvHGTfSUMrc77WXSr4hIFE3d/bVkagiZIlin4CdjCZg\n994bD+wgsMlq95uN+Td0SuB92ryOEqOneeAk79TiFeYzvuhArnG18Kz4ZsH1\n07TC4L6yuTLqHF98tkN/I+/eR5TYUo59VKcLFHfWiImTQd8/BbXMN0SDTIVl\nmN1j4l2HR0Ldyhnre65eDh7ww6rlmft5gksls4tm7hNn9RieWnZv12P6YOZZ\nELHVy/QK2vJcxXz3P6koSlySX1MdiDEfhXyXG1tk0uEEgwcwdopu5vPlvDfM\n7HPorN9Yqq4y1f1W0RVgKTz1oQCGRVhki0q10iMIE9ivsFaMyrsDrWMZszMJ\nP24oYC0FQgIBeDW5A/IfD7ylQsg2EAkFC6zXyL6GkRlOHW+at7FVwSzQ8fxf\nPMG/F5vTTk5NFPVeGKKY4PevwFdpNQk3FVwd9gYnPRmnY1/bx/CvZNV15x19\ndaLm\r\n=eIyV\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"84b43ffb15096f288ba9701655c05d64622f77e8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.6-alpha.17_1579102200000_0.5626954775826387","host":"s3://npm-registry-packages"}},"1.2.6-alpha.19":{"name":"@apollosproject/ui-onboarding","version":"1.2.6-alpha.19","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.6-alpha.19","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"15c8e3dc5a0906d36b993d9eec62ea31be65246c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.6-alpha.19.tgz","fileCount":69,"integrity":"sha512-Ssg8OJS2HKD0P6vrR2XE+VBP6VPqyrI3LdwIkIf08fodD3e7cXCbxlUTN3Oss5TJAMTadL3skNuBM28JwuFAyg==","signatures":[{"sig":"MEUCIHvAYeGrGppl4ohv5OqSwgQbCn90h/Xjz0pX9kEaAnwqAiEAkgl097vMmOG7wF21VdDqLY8anRIqKOJ3asx562bbow0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":622317,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeH2WrCRA9TVsSAnZWagAA1isP/RnRys1jnD0qMtHEDxZj\n350HlBesgIqy9g3aJj7d6jnWyWn1AeU88UDlkYfFEjNSQkaJXleY/K7B8CJS\nTcPrqee/CW6mfV9sQhFO8n2B3jVcuNIEYuxgerr8xjppJb1GoSYeS24qV/RE\n9Hgv5gUkm6pRUppj8qcpQAOXl0J1VOAmVOjA+Skfv00dtWubdv5FjDCmnw8/\nJ4gdPu2vbYwz0Pa8FOB1rpehmxy8toYA0qw4Dw8OtFpxX3g0royVymYc6rkp\nxTx5wAyzvGMCAkhdDBalVhMZ7ZuQhBfnO6CUvfVp1gVGRA+mimo+1DnVLqRr\nZof+BR36mbOBzYNbei7CJJ+2fH4zA273l06Uh6cC/V76kcL7GfBwwpBjUNol\nvCCUF1OVcI3oRU0xEymVgUciWU8E0pRoMOxTATP6Ny9g5YBg65uo2KoAhm8I\n/bSrOupI2BEGPb6kqiqDpk6rCDWKUb3RegC4Cfr3vhyRhIGd92Je6JpT3FJ0\nROukPxCaONTj/DOdz/agWIwBieOgWK+Dqjkgdp1omMj6kkacoB1E8qZOQWko\nJbDK8fSoDCnpsJnmjWDzMYkVdAGAVnNFudy4MRc1nfA2cW64klQSPBxF3dFl\ngZJY9zy441VJW0za0PKUW+L6o7NJFwekxOD27yjUdxJvWkuYv0ncoganm0PK\ncqD5\r\n=iba5\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"e38eb925c69c45cf419227f46121335288ec4095","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.6-alpha.19_1579115947398_0.3064235515103537","host":"s3://npm-registry-packages"}},"1.3.0-beta.0":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-beta.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-beta.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"49a8d0754a5d42613cbdc3e1c01f598ee85393e9","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-beta.0.tgz","fileCount":70,"integrity":"sha512-u/s8wWxRdtAHryOTCuNRWqXwa3HQA4jYn1H/pIB3CDNr+dcqHfJV2FfVLBfTFv+vCv69r3Odtz/tsl5pm6KggA==","signatures":[{"sig":"MEYCIQD+N/fsZjyAus6VPY1mzc+BLA/7o8PUgAOUuyMUlhyXkgIhAMAm9NH1qtLmINhioI8YT6v5/qcvSA8XlI2VoJu1GHfv","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628455,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeIIGkCRA9TVsSAnZWagAANnkP/jpOYdttyE+vYEXaf/wj\nDDcJphoVCfEqUoDcbtTo6gFYBiV9Dc6ajkMAylv5erLJv9MldHAVsF2UiHoQ\nMjty24mzhtmFtri4YR0X06d04/M7AexuIxFMxX1QatUIxuHsgbcKq2+7sBRb\nnYznYemEjt1aR1UbZQ4OWZjRAxObLe1riI+vxLBAXrpVDGhDg5CFbN27b59a\ntfPhTC50vPuPJjmkyQ+wBHb06FLkh61QWJqJSGPyidi53rdfsBuUnqLrhlop\nx5z3xXPNMS3Mkr8i8AGebWf7GUQoF8RKNSXpiZ36qsSp66M56qfGHgJltd5j\nxCGmkLSkEiwDgtfxko9LYtjz7HLUgdA1LHlP01H9s2ckoY9iGPjWquRus+Wo\nWJ/8TwwdZcwGFG2fAWVMFq7q3DsLmnLG/vtgXeF9y1QMOJp5ADvtpUG9Ppk2\nikJvvr0EytWKVJbs2P7G5JqJ29P1FOq0ZD9rpUqrjOZVBZhFoDNhzOiXfTed\n3MGwkXmS6GmYgyverVICnAaCtDyV/AXb89cuBBKLdwbJn3kXf8Z+lcUwgpN9\nbI58d0CRfj/iukLHfU0H8QjC/oI7v5gttmU/RsL2GNA65w4COf2Jdyc5ciXi\n067yaYM/truozBR7qG26j3dxmJpQaBJ5oF/FkePv3GgQUObAY4fgdGVY5ePd\nI15p\r\n=bLuN\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"a7345a0681a2efe7f254bf387b6c3c4c5349293e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-beta.0_1579188640756_0.9179546904768152","host":"s3://npm-registry-packages"}},"1.2.6-alpha.22":{"name":"@apollosproject/ui-onboarding","version":"1.2.6-alpha.22","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.2.6-alpha.22","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"4b6a523ca70ab1ecb2908e13071b5999c4a3cc46","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.2.6-alpha.22.tgz","fileCount":69,"integrity":"sha512-Xda6Dmsbyvjg2cIeg2f5OJlHiPgOSWOWYOouvZlkBzNgn8TCn/QU92eaqc1gf3rqerMPgfdeQZroklIyjTqCWw==","signatures":[{"sig":"MEQCID0KRvFKqHHEHUpW0f9AQdWsEyd9V2BqE7CraWEr81LsAiB3F/3NUBYfs/fQm+DaDpysO1nurWvrLepBywc0q990lQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":622317,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeIJIZCRA9TVsSAnZWagAAyuQP/jZVIATxjFNhy9evspXV\nl0153jvv5fQXtnNrk+3U2Z/Istb5/ULy8NXQcmQY9sJjDOIJ0y3JIfKvIlRW\nQ7zzW8fE0rTtLhnYTal9V0dj8H89Hh3zQYtNgQKbMS7P8GlVDIAWy961SbPw\nIQQsty6k5fgVxosHkducGbjTQ7w3rZTkpTebc5wkFsFrYkQ6I8BCe+TaoJxm\nnAD9rfntb25BzqWBVxE0Hbj6jdMtwteSZs5yoVN+TZW8A+564nFEJrqKiX3a\ni07ugypfJU5nBSsFZs8G7V0uM7yWlnG6C+i5DB6C1YCTGDKvHi4ORZsuHfzp\nyCt12PPPdJJRSBGg5qJu19N88WUqOG4WEUII+hEu9X0tuHjLcBoFuSaUtu3Y\nUOpjmiIuR76WijCIsLO7A43nZTUROsvwxH1X5eOMPDmnoyZEGPluQPr1WrNt\nHZeIrqBmg6uCT5yX2Noh0Eou6A5Yh7VaFK7bsQVzLPvaLY2MDhXfhD09dTgE\n6DHWR+1MG32tJOP0+zFla+uutHrLSHG4i1gZPB8OU9Axh/5GcXLstd5cRkOS\n2ORGHHhjfOWLBDr/wSddwTwJpubIIbviorqDzpGH5h7jXYBXzXMXQqgsEZHg\n4Zl8dKfQxsffs9i7JUMXxanoYqSrrXN3/UZSxF6YvlTOGEPxPpLq8Y7MzhmH\nApOR\r\n=I7ru\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"908f5e3aff2138f450b571c49b777a1152c49d11","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.2.6-alpha.22_1579192857286_0.6357305000326869","host":"s3://npm-registry-packages"}},"1.3.0-beta.1":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-beta.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-beta.1","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"5dc49fcec01a031842f163e98e2f2da09e1b51f3","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-beta.1.tgz","fileCount":70,"integrity":"sha512-VKaCZMKepsxfzgg2elqGd7zgbBJ895nn18FftB9Q0c+dawjf9oBKs2pp1LeuNa8GMMkb1WPs2S+C7D419TXoBg==","signatures":[{"sig":"MEUCIQDdWVG9PL7IoAv326PkPVxDlqacqlwv0d2ruXixCKZklAIgYJ34koTycOfgIt/B8U7IDAAgztjkITcsqXE/RRPOyZc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628455,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeIM8XCRA9TVsSAnZWagAApvsQAI2IGFbvjBmOvZnA3iCy\nhOKqpiJRQBKg+eCenA4RmJHWkIeqDPX/9aAJk3haAENsvfKv91cvG9YJjrFg\nyFwi4MuNdi7Zwf3BrM8E8VBM9yM9h4N0fcMNbpOUmE2eS2Iqvc08Qbd3Ez2j\n+1JSiyZXJK7S1vQf9FtnILP1nuLBZry7cpuToAUCWioaDbJ8AF2lzsI+fKtf\noWF7uuGx/xfdM8p5vKeFTuQARuiWaYpcsL8doaL/MBbPe/Rj5UWbS3JCbwE0\nX0ZN/nlyw+GNL9TxvkxKUuYoPgI5ttL1NrUKfsJF6Q8CQ0RWB+KqvbzrkKfK\nZ0PzSvvX29/cUThOKXME/28lzK5OziOqsvHeCJJ9oGEzZloHAtv7L0dfwHNx\n+jk/jeiY3+OQraFRAazPGb7vouSgAoe2ITwj8vt6+hq9L49Qgc02k8TSmdcU\niE2XNmZ5OyOTeFmDjWNDN9x76i1D095xE2nKC5nBUD3cOdAnCwLt+u7PAwQy\nqLFrI7t79DGx/oM80tQ0IPR86ZlZgDdhsA8w/oyGlT4r48RwKwCMg+044Dti\nqQIXJgqTlYuAqKa99x78feFuA6JwLnnNh2ZgASmu8NInjrA588ScAG01eXCj\nlAygsJ8rarBngWyAW6/R1J1wiw/F/T7oo3+0IYzkpIdy1TdSRrTiidqwjBGU\noKtn\r\n=m70P\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"b027c945a9917fc329091277499bd9a4a6605fc7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-beta.1_1579208470908_0.36733894806557066","host":"s3://npm-registry-packages"}},"1.3.0-alpha.0":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-alpha.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-alpha.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"de8a8f537650316db32da79fb39b52f0ae34123d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-alpha.0.tgz","fileCount":69,"integrity":"sha512-WL9jVVeBMGfVurKJt9h4EDhs/OfROTfpaKrn+riaw9dY3TVDQvBxFxZBNk8yKQ/8T9lBa08sXK4W4gSjzTVtdg==","signatures":[{"sig":"MEUCIE9Toc4h1pM6yJabOn712WrGRALP2V7AwFJEzbADw111AiEAvtpqNe7UZzc9CWquqrhDsOHseNVjRLCjsOafM2FipXM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":622316,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeIeB0CRA9TVsSAnZWagAAt7EP/0KSnet903XAw0uxcjlz\n88nybYdDLHy0yabCYCizANmiNwRvMxpkV84Pdn7jseiS//fnzw6ulnQaZv+T\ntUjEp2qKGmPlcJed0gVaq7Hdg6novQzMS4VmFYHEha3kAPNgjBDvhdyL06+O\nUggYghMvQ+Tm2JxvxzcGBGmpCY5GyrszK1aiTnKwNrRuHbv9wcJJK0Ae449O\nQ2DK/Up7lFJ3ixRn2qP9MiDwach6lLQY9h+fi7cxR8EbWt5z2jDjsAEmG2rZ\n4hot04+K8j69EYNgEggmQe5xzCXJHlcWib+hNsMsGxLOsRJhgNIJm0fMTsnU\nfmm+UvLHwh3D3+n+k9HikV9sqrErohBHnRmkdqO9Y6cNzVgnBAxb4HHaSQcH\neeFbcDlTFq1ufBdJtl7QHRIaoXx34ZVbE+a6n5R+QsNq4bLkVUHPFKDACfuB\nLqluSU0Fk/1R3OesIz6giw2BlV+iHpdK6Iq4rnjGM6ezT+mH3NsQ6ciGYTwd\nFBn410MoqWaxmv9DkX0bFezX0ZCE0JvjZa64quF7QEhbKjUc3aonemAf3QLy\n6GlJK5bqCQy9Evs58Q8+fqjpOHWyFkIX+fssCuMog+TcgmJJbmGFNJgdm7yS\niR3ajj7pLam1islvOQQs/Abp1v/lmXF7uYJwSW4z1Z3LiQjCeoN3a24h1Fmn\n/EKq\r\n=Ym82\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"8862021c02d3c430f0968feda46c22ceecfa2bb7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.5.1","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-alpha.0_1579278451684_0.45917683056365943","host":"s3://npm-registry-packages"}},"1.3.0-alpha.15":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-alpha.15","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-alpha.15","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"bc41722b163edb240b57181e64d8d06168d447e7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-alpha.15.tgz","fileCount":69,"integrity":"sha512-S7jef2Yng5ZKZ9AvcRngxgoxY0KZTwOVZPfTbpv1L7ovcbKgUA4JLFB3lZo7LKiFecxHPAKb2bln4bTR8kHsag==","signatures":[{"sig":"MEUCIDGbiJgbH2Klqz92O2P5ijCA0krfOcL52EiHMMUmxzjoAiEA/yzuN3BoOBhV6MT1dtnnQF7+cOjbfkYeW6rUMtSBK1o=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":622317,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeMHbcCRA9TVsSAnZWagAA8T4P/jnKwMO2V1y+1cwFO1n0\nDSS0a3XFv2ENcNlss3n3yKx9clkphFr7/h0lXhRRBpmT9tGY59wzzYmLfy2H\nRMaT48UWKLVSqrvyfPWk9KvkViz3T2JPJX9NrzYBSLFkDMsoB2sbp4bEQZ/q\nnUEDbm5v7c98mHUzmXkrRPOoJXojvSoUpLu3cMGwCsRRJxzt0MMkmuJfY0gC\nSi8BW7+smI61ElRXlaHbjLWs4TGd/9RsfXDj+OdD9gHMMZrOEg70WV9s85ss\n9ZRIv1d9iuD9cGrDXzPdYygib2MqHbl4j7znYNzWFtAF15YrtJ7lajjQTSlv\noayq7Htyyp0RneDzU8TQyuyRKD9GmYVqsoF4zjhoI6jRGk1r7DCU/5goqkOE\nwtuxrANO09/xz6XTYxMzHlJ1OVUvcG9/R6bQ11DqZs02H5rxu4Z6MURn97Di\ntBPJMdlsj18AN1lYdp7NGx1OBKpxb9AwndYeuyuKRymC1aDlck2CPyYC1j+h\nVdgWlYlhKCabMWBXHJRP4FKcHREq/fLM7F0GciKf4h1pxB8dLJ75tv4vTsqR\nI+1NqglnJ89TSKTQtkXYIyAIxG1cIPW716xmDZXDqo8o9JKBAWF/LA514cmk\nMYBxLshIjMOrN65tncyUuBZ8SiCCHBi8oTo2uxz1nMB/TuEBXPd/XhXLwERw\nNhMv\r\n=ek9r\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"e14932a5c8d6ab0cdf6305526cd1d90133b05a36","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-alpha.15_1580234459873_0.5113826143058844","host":"s3://npm-registry-packages"}},"1.3.0-beta.2":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-beta.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-beta.2","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"6a7f5e45f49693ba5fb9f3423ac4db3483311e5d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-beta.2.tgz","fileCount":70,"integrity":"sha512-PfLlLUSG+dmYws1qXaTQvqd6Mek5Gq/rCPVl0kyfpiNXyYegZDJeWdfcbo7+MBqY5lIiAJ7nGO8HyQotrZdzJQ==","signatures":[{"sig":"MEQCIB4Yobf8hJmXbb29ZW4/RF265oB0E5X2s5KMdBvCD2OJAiBdB2FvMlYTG5JUhFBEByEU29bfHJTHGIv9oBUjXH31ug==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628455,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeMILeCRA9TVsSAnZWagAAn9gP/iBJS3nfRjAVdBm/iTWg\n7NhyTL0Ez6kOK+mSSCFfLW01a8QEAPhf/LBv4Z5qHQrHrqc9DMgBQYlntgq4\nbgdlZznyIu7cNyxWdKyuWFuZtov8PhS/GU6C8wI7JL/JGf4UKOQMXjgF6Yl1\nSl4GzNTwxA5XnZDRvjOY9RV1+TIyAi6GuoUC3s8kP2s5ZZ6sMm3crxghP5TQ\ns4xtD+aZc2FRhBGxhZDURMSR0DnJQUW9Ew8Jj+R6a4s2mjYDUWtWeYGBbU0v\nQ+xaSV5P7ZBWnyw2xgNcg3mv75vbPudxr+sHNKwjskX+gqMTeMNu6bymxhtF\n3cDRRV6jKsUPgxlxIIlYYl5kNQzF8gKVkMjFmRVWo09y3sKOlMY1bnBW7KMM\nWQ6pVGGTFRxlkHpmEGw08iYC4JfSH8MghAR5BeFkwr9iMS5+nE7D9OOZCY2i\nhIUqqgj62U15e1QJ4lsydyPXWgnvVU2j66THvSq+PHmlqa1NhnXk9LgNJKLc\nMCXi019gI4crnqC1+6evWChQMgjpjx+vmOZ4u69PUK+HjZbRQxJAhTO+baKF\nDE5DthZV19jjlN7hJkWyToLwc5eQ6ZUV5uB7uX5kojSyTFiKsg1KZ1aa5Pmb\nBm73zh8U5oO2qMhWDr6mkAPuZ8TqVI1nNlS+XFipFLCiLf+JJJDXTh0R0GQ5\nUgVX\r\n=7wyM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"0109f278cc7218bbe9bf66de6decce6376316b43","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-beta.2_1580237533501_0.9514301830964187","host":"s3://npm-registry-packages"}},"1.3.0-beta.3":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-beta.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-beta.3","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"610a3088a2354d0ee45b8ca9e0edfd4c8067a364","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-beta.3.tgz","fileCount":70,"integrity":"sha512-TxfsKb4lj0MyfySyVwWiIcDn/JX3hF4kL+wrn0Oes+wNGDwUywaLirGNS+rpLZBmxABJpo+33vWO5KA1LZpSQg==","signatures":[{"sig":"MEYCIQCQQW9wpfRaTxVWqNMljePn1Z3OxjFEUXwCDCN596b//AIhAP3mGGpgCLUk1H3hLmp9Pdwc844T7c0h3/phR7AVIUZQ","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628455,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeMJgqCRA9TVsSAnZWagAAwZoP/iHlwrn6PqlaiuRUvjAc\n7W9RjSXF0E5cDDGby6qkUMW21FxGFlBtPB3H86ZyGmgMyyYCNyeaf4oKRYgx\n3jAhlpplODeSkk2oC4zdO1yiiT0H5Go2WzlxALzKkbFlCfZhfjKRpXwxU2hl\nVdGF86bI0a4lI3Fj0x9e7J10G1izKx6I8ziRYt0ypIKIYI4hKTVTx2uTx8sd\nqvzaJZvZPc2xLrw8eO9kDUo3oRVfU+VTG/vP0pGVq5eu4tdxbjZ7rKXnDU7y\ngEdSp6oXaOfqMP/N25DWNsjlUWwdtl79fXDp3kVIZYjfTg2YbKNqgMLf55Om\niAhsKLCrmG2ybk7lHG2npz8DyPLUIjVoJtE/De51NaohxqhXv1y5ne4TWBmE\nB/NNcL3wFM0wE1WIRE2cqkLudzbN0dzNWfQmIcWC3pCF3VUynRZ18pm18kK1\nA3wZAQHOP3mmmKf2uwN0KTc+9hQvFEnmibasSLAv26nqchhy59ksnl2IEdfs\no+2cUP13ALashZohkfHUAkNySpW629p23NNMSZBmHKV1YZQqCdNxe77N47UV\nJW3KE+BRRS16DOkfLyevYTrCx/c6JIS+watNJNePJ3gGn1Vx0JPUmn8/FN+9\n431xcDNiBZj1oZg20M6/Qhh9ePP/ehYIsHNbklms0CFKriAW5bB1uaTmr6Z1\nu2Zn\r\n=HIYt\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"1da2572c36b545151a59d91ec093f2d3e935a29e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-beta.3_1580242986128_0.6165766276036324","host":"s3://npm-registry-packages"}},"1.3.0-beta.4":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-beta.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-beta.4","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"34dd79cae374a14583ae99477ba9fa717179bdda","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-beta.4.tgz","fileCount":70,"integrity":"sha512-ovdY1tkeCJt270JptedsT/A32Fh0b6u3fzDYLj68mSwOtpk3ajPOpmEGUPDdh6M2ZZ0bXbUYqxiSJXlUlim0Mg==","signatures":[{"sig":"MEUCIQCkOivH4YWIYr0tOUW11Zk0CcV1KlwMvMqIE23WSTOdpgIgfvnGW39ut1RIpA9Ll4wU2jmyxZkJ8EoOGaHld1m/0cY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628455,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeMYhQCRA9TVsSAnZWagAAKwMQAJqQL50CMTMX+PrM9h2z\nO9snXBxKFRjFbgwU1oKih71R8iT3rhBhtpbXOgSJRlM4mn9oyODcYtQ2j/t2\nqVQvc8M1dxR1OEmKxdgRA/7kLLGXLYnsqDAunC6cR4+f81FVBte0Y2X1Wo2H\np/KjOG2SrwtoHInUYcwF/c/E/VgpF8MkZGNf/c1zZWkY+JJkEe+OKEhr+dhf\n0n9kHWuMBHpxbqQAv+GubsTOGs60n4RCDwpr2eR3iPImHSKS63zsttFbcegC\n+HRuqlpNavRJkjE5qyynp3F98z9APdy3k76S4HfPCMD355r5TAYeEnq/6AM5\nq5QP/nMJnjGOzp0+7/Bl5i47CxEjsboybiOwZwwXLOQoA7KildzJlW0wziFP\nnR1n5deHCoh+UsX+4zaHipTy4tXFkuV3uDFEomN7ierLWi4jDMnjGDEt+lvb\n10ZWPl7AXcApYbzjDjpoZt+RVgmaImIlPfATZAR60A6azstJZ+DEjmmDT8BN\nc51t3Kh+QkerpXjhyP/p6Hc6jECeF3LvkZ2g6/t/tFjPlNdYLre4+9Ee2bj1\nS/Po277pZchkpmP98tRPooT6Jihv4Eh8/j1tiJ+QVAcCYHZbcV4K7aLtzVTk\nv0hg4TsHaGTy2pKVgPZnid41SrvESQc9M83YnEonJJokCq+hOml+vsolvyza\n0siP\r\n=5Okh\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"b129d78d8be5a702603f594494719f1cebe0e981","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-beta.4_1580304464298_0.35287015611319017","host":"s3://npm-registry-packages"}},"1.3.0-alpha.17":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-alpha.17","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-alpha.17","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"b0f3cede1d37a0f80dfea3ca38e792d051b3919b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-alpha.17.tgz","fileCount":69,"integrity":"sha512-cUS9PstUA5uyAGdMsFiRBno6K7Zgh+nT923b+zN4rvSb81n2DP3hvwEzUm3RuQ6gOYGffbBypsPZIM7v0M6OGQ==","signatures":[{"sig":"MEQCIEI7Ql4XohMRdqKvoDwsqK2YHIKM1yUxsbiURBujsk3jAiBlQ1Uffn1/QgOA1RlCh2pH7eyYh8YxiXWDvmFk1OIUfQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":622298,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJePFjvCRA9TVsSAnZWagAAfB0P/3WCIlimBhP2+35bLZqp\n7+8KFrNcM1L4scsU0IoaRikrQNp2chSEBrPdT3W6je1YuDSzJMYTqYn9BNsm\nZrF+/+j/1QBT2KolzQ492XePChdlCvkew3yhISi9EmfkzDbkka6U9Bgculqi\nmvQo7Ic30dqFpWsOhgKdETJVm6K4Wxx6CVKVJ7MmrYC97Q6emPwbbdGDdvY8\nhl6CSyIPeoms6Jd+C5tbLgrcE9fvb+Oxp5KQl7Ew5c12ov0RP/mituDhbKbR\np2Y8ukKh6WLawvnOMd5PZyX8wCZX0SYs1gRNNsfTXXI/tTnGYPRr5Ft2wEnx\nhc6QiYasUnMYbrPFpO3/gMszvbQgGzxjNsaV0bdJxe63Wu0WKkTG1JwEUkn6\nNLVsMbrJyxoDqzhiwbiuPbAOFJYypFrXBZ5jM4XNcACggl3QMEtMpaF2U48v\noCCItuiEWtDTmfvFEZn2+IF8LeV1PG5xd1mdYZOCpbVhHtlBMG1jxEo3NraF\nO3M8eMRnJFFS7JEGTYzosroC7ao3DuckU0POMM1MnBPeWHJhtjGLAVoaq8/n\n2xQfSE+wo4Yme0iGng6rqJ+FQa/G7/Cpr38dGhMV9srWNvHBNY+OiwR4WYm5\ni90ysmLCIVA/TvTHVhP8y7uBZxee9FbbWLKx7JraCpbMLQK/pvM92c22mwqB\nJRiY\r\n=G6i/\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"d16c4826f9ee8dbdd66aeee1822effa9f4014326","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-alpha.17_1581013231002_0.4350901053102372","host":"s3://npm-registry-packages"}},"1.3.0-beta.5":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-beta.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-beta.5","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"220e4e9428c987ca662ad39e5ee3e501009632b2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-beta.5.tgz","fileCount":70,"integrity":"sha512-9qc0Ayp8zXptC7zm2P3GsDc9akNzgZBIwWf/qkNEI3RMjGnoDf9V01EsUEqBfY0uAeD4TBL4U9WWfhQn+gqxJA==","signatures":[{"sig":"MEUCIQCeeaQnrBYiwJnNCgMNI6ZP5Mn7iK81BzzUCelLHC+exwIgCiMUPy5AXBgaIoh9BAlpvTLqLMMrIq/87AIh+v+aVfU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628436,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJePHLjCRA9TVsSAnZWagAA1LsP/1C8CJm75ojyJ95lVq4L\nZO1B8iXNr8xfMEAuOxOw5N3wFQr3Db3gCWXnPgeAMB4G8P4bnvoH8ANeGH8E\n3qLuMhoH27g/BQkKKLwrAOAPiVljMX+cvWFH3FxUChDr5lBiBlRpnwmukAod\n1fbWd9SynN9bCUVuNRWB6DFpRxLBmlpFTDZGGCu5LzmZ0lK7+l7ZfcvluWuE\n1NStSa/3RrY7vJpE9NlcA/NuF7qL5Ipx+gu4dVKO275/FAFDGS669UMEL88J\nDaKWn2aagtTLjts2ivXfBm/nkNl1Fz7z6zxUuahmiGkv5WtrUsGBviA03pNe\nTBQbm8kq+o7i8sZH33ikXNf8ZKo73hMcwbjinP21bemE7llqj9S5cVCH/1pK\nHxMvvTVt5I5OIvcmLV+V4V+Ir2XLbAUGjNhD/vGk8QbTHCUtfcDR1rttcL8L\nEfQvMPDxdGo+FL7bk1uabJQVq24tRS1A2ySesqdqhM8V4LW+cI8vZR1IeP4J\nffDaDAMoNXOVtK2K5rRVyEfqRxANrnZzQg72eGsOJpVcspOIUXkYprzX6fO1\nMnj1+ut6nySnB2EVBYC5R7jMIlB9atE1XrwXIaKZIvCR+87+QIse/Dyr+JB5\nYJPCITtT59WItei2ahxVShSYmtjF7Tp0gFyzDTI5ckOk1BlF7NI9O068KKny\nL00V\r\n=7FVO\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"e7d9bd731240476ea19530b2bc7ec66b70901402","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-beta.5_1581019875406_0.34642264247871757","host":"s3://npm-registry-packages"}},"1.3.0-alpha.19":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-alpha.19","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-alpha.19","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"e2c55577fcdfe35c8d99b6ddd3918dea3dec6c93","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-alpha.19.tgz","fileCount":69,"integrity":"sha512-qM1EnTE8PHfZqh4+7NyPmsjk/EMex/jb70dsgmt8RIvkLYmQhiUUl3CJCCwIZXTL/Rb4WkNVxP7GpaQz6OBGBA==","signatures":[{"sig":"MEQCIAWu5GV1OU8sVu1YiIanOLxOWVQmHIbTKw/P78ufeg08AiABBe2TsCChB45Yp7tbtA4zSGJ/qGzyBbUUgQifWwoNIw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":622298,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJePINNCRA9TVsSAnZWagAACn4P/1xsZ2zu6qk9vRKZHFq1\n2wEfGLrlGYzV3OC7NlE1v4FFVKAI3nKpqU+zmV4WapDQtRQv+c7IyuVWkwfy\n0AKDftOOtrniv52yWX3tW1flLHO80MQlygmr38RgReR/uoS0VdMuiAasTPU3\n7nLqQAEhsbpeCrzi6ky72N14sro3yMr4zeJA3VA7qVgZyrgfTetwQRPtsOFi\nGzH8/JpNjrBbx6xjgp9Dm4ndM8uZZY+/AgKy5zJ/oyQV7R+d7p//WjBKLhLO\ncMa5kKTxAdqR9ENo8dqTIEVSwjRsAqU3Px9Zm7/Gx9X0/TbJMeSfeUkPQrRh\nMUq1e0xKHytDi39HUrLqPdt8tKN22jBVh3cwQZhlDl+rs2Ho9cigBE0RvCkl\n+lBtUqRprLTpJz6nsSVTHNHwvILIGrmcsp09hUK71wYZeiKjEn61WNPR00oD\nSm6mfjQa6wTZvd45hI3OI4cR8v6GmMbrlogBphQjXje6/l93gmkf5FE7EXXS\nN5tpZFfyal9p1ZzyIbiLyNBlaBtQ3+Khdq50I3GKQAvkePqJZIS76KRE5fai\nf4J0nk81cMd5paNDK3APRIOyLpM1+L9YwxAaamYyjAdFsoMe/rpFM9Qim9I+\n69dNhO0YiMfcTSNO5FMNVkncY8rmg+ft3Em6TnkgbrLfJZStkW46MN57OCAH\n1OCS\r\n=+oTC\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"16e8033ba27b8133042f1cf77a4a1982f2c48478","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.11.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.11.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-alpha.19_1581024076835_0.9547824954147015","host":"s3://npm-registry-packages"}},"1.3.0-beta.6":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-beta.6","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-beta.6","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"cfb37e900cd5f4a068623a965640c41a30e03260","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-beta.6.tgz","fileCount":70,"integrity":"sha512-YJ5PZWkv7aFeXzq383bK2JL7Xk3mojNsQMg6aBnybdPDETuH+bnsbTPsjsv6dAlCuSTGocsDtGYJBB1ahvBLsw==","signatures":[{"sig":"MEYCIQD7RcikuuHaMl7Iyx4GTYOkhkXnXhvueiCHd4yqbKxbDAIhAJvKL8Qli4UYI4shAtIu9RmLtrSof431xYRi+E3SoySv","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628436,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeTV7tCRA9TVsSAnZWagAAYt0P/io8LfGC+p5GO4k18TRx\nWrasZiMF8apPVJN6OcHA61tUCbWb+FaChCrqcG5ustMMzVkY3d19PQiQLkAW\nSBVPbXSe1VrsmW4pcZg/WvFv8DYm0mSVy1yH9lvZJcXtvrLea12Aw92ihCjC\n1b7XGQ2ePf8DxdsHCG9TzhHeF5NpOnwgpDxxJ5DM7zZ1nnYCIK3lymsnKkuD\nkt0b6Yp2fkDhQZIPlll78WU/DVkPkGd35yjCnJ+fesTjkQA1PMGOuEKq9l02\n8fr6eVbrwD0XNp9hdUI0/nepz6cOEKr/a0qp/0180v9YOaVh56V5Pby80r4+\nw96ZJazTwKMXy4TQoT7if1Fqa77gth4KSNGrMvLzkYp8DseCWOn9F2vDlrHo\nvpT2+p7bI/uD6tV6jng3ACHTf0pCSDvqQZvzKB9qs2tKgROBb6Op1hcOwOBy\nLoHHiNOMRJtvfKKuAuXp77/bs/Nxy+6xv1e6ErO+xQM9rjqh3TmIZNHNRzsk\nqYe/67wd1952aBTvn9zLz04UabX+2vP8OryYuXmwiib/XqsCYmaZ7fYJVamy\nEdGY8QKYrl5FgEUzsQ3yp/cL8RTSsq+nXGjWo8fuiCsdxRaYIgIQ87FeMPZs\nFGqH/tQpcrp9QDVlijkZs+0EHh42StHxSVp0fkJTwwN3tZmum0ttnTiRtOif\ndQT9\r\n=Ceyp\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"1a822d0545c45ceb655b1ce8b19b03b842ad4d14","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-beta.6_1582128876952_0.7513469810340574","host":"s3://npm-registry-packages"}},"1.3.0":{"name":"@apollosproject/ui-onboarding","version":"1.3.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"8aee9768225605fb698e870c762c8e65f3efd903","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0.tgz","fileCount":70,"integrity":"sha512-he5lGOY6U3PNURcBdrr+5Qz14VmW19Y/Qjmr68uMKnW1VUkSO3NKLkAQujFpLMAg0/eY151acGDPoZI3tFjUkg==","signatures":[{"sig":"MEUCIDkbu8ebtrbi/GgmBhZ4L0DSb5Rnh/7EqLPYICGaS3nDAiEA3XY6/UvB8bIFAdufPrjpZ/SC3gJRWYTUMZhIEwc67gU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628429,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeYUASCRA9TVsSAnZWagAATboQAJD4kuAnzsT0Cx+kAqNS\nqwp/GQOvBF+uzG5jnDkQ1N5Bx+tjCqgJRyVA9z1CQylIxaiDQpSddDgWEEEy\nOnVkkOqLRc8dsPQEiEOdq7roeBue7y4lqjbG0Nf/Vcw/NFkTZRb7+7Qw02S3\nTJwHS6eNvM1uaUQZMVraIELuM+HjacEUaF30qECrS9/N08INtrTS2gOzawEp\nhGorKJdLw7Ie6xUjCvtBTyftPY0cdcxd0e7aTk1lGV2C2QtIf6nQ1+yiUp/g\nCDBqTCs1xLbFJm3jWxOOi4WbpH17DZapiMvEptBI7M9NMauyjRvvN1Jk3+fs\nu5hHLbkFlYa+szzkTq54Ym/4rsvAtolPx1+nDyVZbGxLq32rqR/EOmqzm9ME\nBu65VVZrVbrtUeDLlUCnbxJumoi348kf1BbXeCzUiXyXqgHEXQhSU2X870Ed\nlCIJHZXt1RWJutUk7aYnOnreCE/w0SCRY4iZH8bu54fOP9tKE1QWp3iGJ7XC\n5l6cYy1PRN0S8RPH5wCRRVIWsEKrBfTAmVeP8VtUNenNC7/iNb45OwRRCkR0\nY13BXV7KVWGek80nowDLtllxJ7MmtH+0o+gmEP5AZ4DiK3u5pjbp+fkLFTEm\nsPSjecK6JywXDZ+Z/jw9SNMQcWodzGncbDSJKq4TwopZjjQw/e0HPetw+bTt\nyKH9\r\n=ArJn\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"aa1df181f575995941c9f879e45c88bf72a84150","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0_1583431698391_0.6791311934063637","host":"s3://npm-registry-packages"}},"1.3.0-alpha.23":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-alpha.23","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-alpha.23","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"c5e9b69bfcf1e6274d6919f97be6cf9e39d440f8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-alpha.23.tgz","fileCount":69,"integrity":"sha512-DNvtI2A25QW41lbOA8zIVy1vkQ7eP1iGcYZph0fwa7LEIf5yF5OShPmRAkDhjWtpmKICurr5gX16S5NHpN9AzQ==","signatures":[{"sig":"MEYCIQDY6Wdflyiz6AAzCyTRGXsxf5YcFBm1RjrLUgjFiz9F/wIhAMyhdAD5y3cz1Gs3I2dp1YcU0TmVvXwCyc10Q6SHs86F","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":622298,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea9W+CRA9TVsSAnZWagAANJIP/3OC56fpwnrEeB0JW6Mj\n/aqaNDVYote7kZvDmSNcRvp2nhkq4cqMkQ5FQOD8l9/Q9XBOUe+c6INAMZ3y\n7AyK1V/hcgj+6IS3LTelfdmNgdXBVuKaR+CfilAiskirzVH1qY72xfPmqN9a\ng3UIDylRTbCWVd/G1t959zAjSpmYHUm+kunKs7LiXj03Tlbzkv1A9HTNeQxA\nLYIMl7lDlk3qSrZ7lAvnuWyginm4193xgMkLsFf12t02Ic9JFijsmNlvrbZp\nybOFAI80ejIpGDASjX/vM7fJfshucbFQq9n0pvmPcX6J3MJU3UqNkBuuiyTG\nWTmhkB6CFKRMG+rQYGY6RjIbC2n/oUZXcT3Mwn+deujkrqGGwYHCe7CWAG/S\nyypqdK8qpkoZnqiL6MBbD/wLhXdWtjM6EhzqYf8J1nQbM20k2++jw40BKtms\nvJtRPUYwKgz9V1xXQOmaqVKEJFTqUPZvPNWP37INkOjpCcIUKwo/ptNzppCq\nZNLD0AppTfvLV1EGu1e+Fh7OFO+Il2/PIpfII1GtMQ1S1ePDucdY59rKqELS\npqmc7A6fRnfrnG4kRHNii+O0qTf/x44iB46leFDPfJAOKNxdKAgIYLq6rlcF\n4lqzHtrqGIMmQNUVCAWOTd8MAepoET0k5jl+C5MSz8+GUr3P6vwDwcMQQIqO\n1uel\r\n=jAUw\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"d114e1c5e19229aa95f88e787c10f7e7be82c217","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-alpha.23_1584125373897_0.005093419841933233","host":"s3://npm-registry-packages"}},"1.3.0-alpha.40":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-alpha.40","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-alpha.40","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"be90b7a3f72b3081c851c36a9b9259f302aeab69","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-alpha.40.tgz","fileCount":69,"integrity":"sha512-fb6zZSP7etoMLoDA7wxOSlEyXQ6Z0BSzIWZwEn8flHt/DFR3Hcered+g5AiraExIfVZgGcPVVlRD64YtD506iw==","signatures":[{"sig":"MEUCIAjrO5EB1c4Ye350WnYB/WyLsNXQW80TOFMfgdyakPSfAiEAzdsKkKcYvRFio+0Dmzg6M3X/PFSzyjDY5a+OfTKEno0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":621863,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJehWrNCRA9TVsSAnZWagAAE24P/RTZcx5xZcJW5WnNr380\nzKemTX/HZUGaJWJGbnwhy70T1vkL12AYsXUrGteCItTng8ukQkjNCE2ZTWJG\n8aYXXOeqAFoSisq/XTkmdpSnSZWiV2vV9VhAvv/PyjTkuNtNPCrz2Y52hE8e\ntQohS8Lia/AkhxI7nT6g/zxdQHwV+9+8b09eKAO+/WOTuOpm3Dv/l9qbQC8v\nXPt2SFlCFN3wj3Eo+tYJTavtrYNtRovKxRkNrwP70mvCwmzDVFYUepH08ug4\nuZdOBdZU+Ljg7VIF3YGVeS6QtCRuUnY6DJ2/kNlrvWiEZTHAVi6Ick/zPCMN\nTGSaOJiPqAIbmGuwA/ENoWBILfik6nl35eQsahq9hp+byIebVplX0j/kdBYj\nIq3kYOXMv7a6HcxiQvNzS2fubT5ibwNyR4ybiJvAdMW9QNg7vwgNM29FEvlv\n7S+/BV8ILVYWFX6pqRmByVXcUDp3PebhU2KXBG9ljIerlU3f9TV8hA8rZ/21\nvyik7/XPhQ3/F7v4Ejj9NjiAX7n1vuNOyhXDkeacx8O1Db+juT0K6fXYJ9BR\n3UOkzmsH9jXm4zUUTnzjHLSaBkCF4WrvOVmU+uNpXla/ftg/CCmOuWXuhEai\n7tWU+4zRvs93wTmhZyZiH/HvCi7n+ynw0dUISzTUwplra7JH+i0wwgX7ChZc\nCdmW\r\n=BCTM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"3adf702400acd1f5c979003dd7d0f54613140abe","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-alpha.40_1585801933428_0.025305407867136198","host":"s3://npm-registry-packages"}},"1.3.0-alpha.42":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-alpha.42","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-alpha.42","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"3586576642729e9c1ea8227036f43cf016d09132","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-alpha.42.tgz","fileCount":69,"integrity":"sha512-er5GMJLoQvdant8D+bWqpS1BoYTOpza6keznXyXnSidGewyalqNcHJvJZQldw4PkWENVfieU/LAtzrWZZ88jRA==","signatures":[{"sig":"MEUCIQCMvrWQV/H5P/pAr7RwjvFvJDztndz0UM//AZ7tu8nucQIgbXeX0cL1DhILzj/1Gyj0qA1e7XknMuneF91riWeAa+Y=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":621863,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJei2aqCRA9TVsSAnZWagAAoa0P+gJPosmvQVtXzPeIJPOT\n/tZWVNC38PDfNx/tIVeTFBHp81i1dUBhCDoG7EFVGv387qtHCXbx1Jxh6B/U\nnpNeu2S/Xtq4s3p6Y01rCR6YXTyE+qOBbmhWqL91t7OduN0dfL6Br8OCw2YV\n2mVTxUyJRRC6ErnREL6MGV0/cebArvWzDLZ62cOxqm5/NhokBOuYnvBaDanG\nvUZHR0sDbIEdF4ZyJ4+cyK8KA9GtO9K77PUKH42k6VruTCrUdpGAowPl9J/y\n/2qaSLTj4xiNqyi3IJceweyp/aJsfEfMXE2zY0MEm8UVQ0yV3h4PIbJW1/7F\nIdxw0PB21PIr43Aq02Zh3oAs1Kl77tfQolAOivs7u4AYmTT2Br7GaY+0OFXT\nR5KHOP8wGk/+xPdddNOm1YOPLtOp8Zf8DS6o853hk0yKhjFKzE+BSQS0DeO3\n1bOv5oR5H2EoIShg24DI5A1c+ndrSSmGYyv48OXIrh6uIc54onE/0ic66pLF\nfn8S4b1hjdGMbvPfegroF4SEDtTpSwFwkAh2tgWFkthZ8AyHmU2i3mS0GI92\nZvEZXVQowLlTq3Zb3qlqOn+9vK8XjUcgyxDKDVK3IsID1FfwJzP2RBT0gVPu\nDs0H9lHDG++LXbp5nOC04XQUCzwV4MmF/X2LCmL8hL9WUHjvhPeogt70foi8\nxAQx\r\n=01Mc\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"739df1d8dd7bb1990d65cf48bce9bc466626491f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-alpha.42_1586194089763_0.7595173238893382","host":"s3://npm-registry-packages"}},"1.3.1-beta.0":{"name":"@apollosproject/ui-onboarding","version":"1.3.1-beta.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.1-beta.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"4cfe7b7a460573e711fc4d5ca0824cb45f0c06b7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.1-beta.0.tgz","fileCount":70,"integrity":"sha512-bpMthHXF8RaAaP502uWRRa195fFoXRK2nRR5O01pV8Iy0Vf7iqIaZ1GssLkiiRCSXkrkXAhmc7ASowxwn7advQ==","signatures":[{"sig":"MEQCIH+Q1jD5pfyahd6rzWkl74hKv34ds5sfg45an18hSf97AiBvhlvVRu0PGCwRUYbJRQbOa2cOd3gpfrPN+pCjk0af/w==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628001,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJei2mWCRA9TVsSAnZWagAAumYP+wa3KzmUWEhn8oUX4Atw\nvVWCgW20HUVHMugYMF5ZEZml97H9eOx75xF3vMTYiiiTsH/Dk8cr13iZbAZW\nmI7T6pilRU5C9d7IAo091E4apQgoY26W4X/0jWFaXUN7WiK8nLwQOHcEJkU0\ntM4p5mNbOmasdth7ZXJdrMb670mw4HxMgjBwouGBFo2LeY3gMSW71zCV84Mq\n0rPpXpE24Re5Hb8pmnAkCIEsw1COsJIUXKjLYh0BRiZzZIdg/2AD+4pD8UH6\n22O3KOjtYxgxTvD3Dg8wn4NT/bcbN5qJl89Cfp5VXsi0VDLV9uxi4vcKRnt0\nU9tlPucWk/w25atvl1MjVFz65/edMI7HLQjx6/VwMJ077UXalVQQRpHfg66n\n03qqw8uQ3icxgrwWHqNamB/kz/Z7bPF9rtlJ5MFjMKMJTznao4jTpkO22HK6\nAQMkp66qilhC+YCIxnOViYQ+hD5EuWCUGwaMrEX1EXEYFWwZ9egiqE202Jfa\n1w+sqd3H3WSYyRYLDB2dO06Ek3fPzCttYHIJPVh7d7A93REWPvK2dNndqDNi\n1AcWkcvNsHyZFz7wmr8iQ49rVGduosv7Ze2YHqcpmF2qYEI9vKJKMoi71rBv\njcaWVMntYoyo/0YZGsB6KGOBpuzNM8WKahQOKo4EFdlK4365XzThyvs/rVGW\ncvuh\r\n=ctRM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"91cbdef2f01893967018f8303d86c8c1a8625ec6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.1-beta.0_1586194838106_0.492492887314971","host":"s3://npm-registry-packages"}},"1.3.0-alpha.46":{"name":"@apollosproject/ui-onboarding","version":"1.3.0-alpha.46","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.0-alpha.46","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"f3c16fdcc6542a6f502294f68d8592b5e5829476","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.0-alpha.46.tgz","fileCount":69,"integrity":"sha512-Zjo/6G/1klIx9SKczhoC1kQFooZoOrnZFpRRVILo45NJMKTMe44nTvsY/GRBM4TXB4xN9w6SphBokH3fAperOQ==","signatures":[{"sig":"MEUCIQDyf9RqVLqpt1BVy+igUkNB4kDZ0RPSFwUKkY5OlbvwlQIgEyyxxg0/luUJfnloe0FGWQnQaY0KbB5Edkb6SML+cgE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":621926,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJejevnCRA9TVsSAnZWagAA0xQP/14oW5M5UaK+IQXqlKX1\nQW0dcB1DZ/qbeiIQXdMOh3qqKTr0Rw4WRSxqhPjbvA7MbINFuQsf7ycx54mp\noc3rubDKNjbATm+AjAw3ytEBW7kMQiysFkfwQKp41dwiGiUJ08LWNj9xyLPE\nY34/yNJCC/G/RcvCg58cjuMM37IjQWGlrFqeJP8vP2S7jq47hdFOI4buCnP8\nZ+V/VGLriKGGUe1eFeZCi8/JHv/DgPSB3564WcDvqJE2SJk4qq2MDInU00lC\nURCLnHgc69FeeBhvobSi9KbR9U2vF/P1T+d2Oqs4scQAUIuoHYER3aSfe/El\nY7jG7L9uZLPa72N8u6f39nAUrv8rDhnuDkM8Yu4GuwSTuFyWmrptoqMw/U1G\niSwfA7lKyYOs502BoWsnair+gCLrzEst4hkjpmin/H9nsnnacP6N/wgPwy48\n2DhKtGKnLW3FFzfDCtk60mRVd/9QAUs88CCBW1qM58J3ve6+ExwoOSKo64PF\nWLYm6lnC28Bv4Gf+VPIDSW7UTBDrteyqQ90G6FE0nRgxplRM17lI/fgLxwz4\nKVuBzGnBGMVV7mEZScmwB02mJ5GhKhDxAznUNvuWfLQFohNSpqne+PYS7VUH\nateipqmGjyBIv5ZpsDv9AElc0O3duqX6WVD0vlp+DA9Uv+JWXHrwZ0sOtSZu\n4MqF\r\n=UvDF\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"47c393627786d5d83a90d9ecaa5c922accad1c8f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.0-alpha.46_1586359271248_0.41005997383524195","host":"s3://npm-registry-packages"}},"1.3.1":{"name":"@apollosproject/ui-onboarding","version":"1.3.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.1","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"a1424c2e0f97dec3185be6d2f57a0b0a860887b2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.1.tgz","fileCount":70,"integrity":"sha512-Xl3mA9o2H1pzgzW41LncDEqnKkI0UvHgjw3b0kZKhE3XKq0Gn3D2NpazBSA2aSt1IkuO7wkv2IsOnUqY5Fxpbg==","signatures":[{"sig":"MEYCIQCNrEpWmRE+Zj4uS3ldR5GGND3hB1NBql6o9Q9lnKUMzgIhAO9b6Gb5lAzrRjctxNB9zJJmFg11Kc/ufyQodTUCBP7+","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628067,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJelH6YCRA9TVsSAnZWagAAIoIP/2V2L72CiYM+tdasBmz0\nJNQmY96XSPgsEy6i0p/ewJ6BobVtC5GClj0tDpFUMlfD7XpKR+qsPAYTobvV\n/AuPgcWmvZ3bMUa8Oa9K230UKtBqpusuFBzah4YJ/gVnJYwRC4n1MZ+B3m2Y\nr/F0B2QSuAXqqLso7sQTPHC4bTs6qETd3Ps10Lu8T8wVjbofRDye26MsXeWU\nYwbA5vCTa1PLQtNCM9rEFnDyc3/bJg0Wdzenul5BzaAU1gnW8O2U5m3YlAQy\nJTNxIGnnEL2RGJtIIF1qEcx6L600d2neRBwLt0R2AOgiUAt2JmC6FH8XOq5C\nFlofn0JyptRVwRL5aP+K9I73yBn19hd3o727VSMXtp5Q3VLzkU7VQCNArDzM\nVJW7GHAIxfTw01w4SwvrdnB//Op9ztiilMGcLYiJUekob4mpgpJh4I7BDr6t\nVH1sBQ+kb6yo22mFKMjISWlQDchDkxExqJu3whVZI3xtL21wJbnXWP4X7Qxm\n+c9otmiL9SxZFbyc2SGprUE+DbgI7RA7PV+grPrM8N0bTcZQsiHERGypurIe\nrBgTIdjQdzm1uxxk6wqigdwiNdQxfu1uvpLYgr16SRoOBSSD/rku10RviMLX\nxiPbjKR0SmtIAfaYLM2A37SwwbIq6O4UzL8tT0NFg+aFQGG24xsnD/zJ2gwu\na642\r\n=xHAD\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"0265946d0836a6c9b373a9e07c502eb9f740332a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.1_1586790033151_0.3799364300811192","host":"s3://npm-registry-packages"}},"1.3.2-1.4.0-beta.0.0":{"name":"@apollosproject/ui-onboarding","version":"1.3.2-1.4.0-beta.0.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.2-1.4.0-beta.0.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"7b60d4e7030f16156528215629279a62587e2af3","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.2-1.4.0-beta.0.0.tgz","fileCount":70,"integrity":"sha512-6H3AdU1LrWyIrN8kGrLS6PegtJbCH2nG1SCNOIGXST+Ju1fDzWprrEG1hujzsH5b1juT02GvZkh8wugtBKe69A==","signatures":[{"sig":"MEQCICFYrjKMANKqUOsd2wMUQ005GwsDh/Zgj9DvyekMORzrAiAArYD1scLvKoXlXDhEWPsvNx7sfGyhOY9i7Ce4jWK4Fw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628082,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJelwQICRA9TVsSAnZWagAABD4P/305uLNBfTjAFabeuywn\nqt8NACqh1edb3NjIBPL+7maywWL5GVU0eRDn0Fqzjr8bW3E/ZBaVFp16BDmY\nYikQlrQX511g33kmIl6WT1qbg1XWKp99w6twdXsViejB5iukAraIYYrLI8H0\nWE3vaoreJjNBXiaqOaJRsWNGFqX5dYtMMVdCqK1O9WNh//Yi3XZIGIUFP8X0\n/J49s4pRFuUVrQbnkcldZPPSnrZqIA3hh5mOkXTAVErk0wUIRFyvzh7VRnJL\nhu/eugl5CONsVSc7HviK6sPtcojl9W2LasyMUmyA8CwHm7Mbz54UlVFBFuC6\ni0dO88cmLsJBTwPvAuJ5UlwjY8vTZV5f0/79uL2jbyH8dEDQ2zkk/bbrLNHy\nRwgG1TSLNhS7b6FRBmGB4Cm/jcIA5m5Q5kA6IUf2sGZ/D2fRpWzddaZAXGcW\nRFlKeOmhXOR+HcZVsplGK/fG9LhwVk08cnqPbuqpAw3chjX0RtXPwmqGRKRP\nL4uXJkrIvBbZzh8xSDMS0Vs9wkuDll6kRgLlVaZn/90m9phdWTSFNX5KSHbw\nQ3rib2odtiHDsn0IZqGdXJo09F5hKK+ILFQ4Agi0GA8yMDjcL1alq1VV9MQ9\nhNbpdKWXhJk4B0pgTh4mr0g+tA51ayKaPWRyKAivEh0TDXnyknN3fwoiaZqP\nQNWP\r\n=ONjJ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"140434179bd91c852b3315f59e9317dd51d410c9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.2-1.4.0-beta.0.0_1586955272501_0.11303909864263706","host":"s3://npm-registry-packages"}},"1.4.0-beta.0":{"name":"@apollosproject/ui-onboarding","version":"1.4.0-beta.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.0-beta.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"8ffbf77e2475b0b331e687615b49fa34b934f2b9","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.0-beta.0.tgz","fileCount":70,"integrity":"sha512-vpqK7PGYjuGyIJaPCq2Xi2tJGCmDr9yxLLu5p8oOM2UHhwCRn3W/J42jLEai2+TRkoqHhKzukvMPQdp+VTVGEA==","signatures":[{"sig":"MEYCIQCg0slOjpcyhoHhFgL+3VZExj7aBXBkt1TfeBLPzFxmhgIhAOTb/m33Mpl2wIQzPCA2Yn/zedRkhy/lMwAW5u3Vn7Fb","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJelwUCCRA9TVsSAnZWagAAjE0QAIapgLMjI28KQS7Ciepz\nJyj6WPGONNIJNpl+hGAYb5sQtnXPsyJoW50asXg7Se6chyCiAUK1ozn7N/Cw\n2JnH3dlCav7gXlgHf/1Mou1wGbXxWPXrzPqmVqoGYNlOP7vRKjN6j+edtll4\nvuMM+QCCmgKopGFp/zsiXr9hVaTh6bpND3JFBCegECU0f1ciA6a6jeT3+Noj\n3NE3ohN+SrmUIjwVQB+2QbIFy0DgX15UVWORciYAtZUix7b9prLzVYR2BD77\nK2x6wOesb6euZDHP4DbK3focU5/z04hHHK1HdfpoNt+kT1RAJSJ40ipB8PgC\nxVVK2rx6zHn8YHv1h2cKhoqKagj0Jj1y73RqztQ63wbC17J7iSfc9Pu8SMQF\nvXzdGdcKNSowhJQjsK5/gckpPSPl+J8AcQaOygBm2AuHf59XJ5iz6gjHkUX+\ndEEQuQ1+6F8tPV4PbRgVx+tAd1Ewe14CXSjcb3kJLUafzSuFvM1IDFKdJnZc\n3gNOrBYEHiHU2rZ4UBLdyM7PxkGc5rlJD3puVmx4zLjbqI7ZA/QIMmwlj7vR\n0SLKxcJjqSsvuwVxMqg9OaItpE2aPc3jc5PsZsN1xRHduuyPYeIxVXhXi2vy\nDF2uQWocedyaTtWVPgN5sj/yeS1YOxmlvWzFYbKX1DQ3oMOdBvuUh339xday\naGTy\r\n=gTwt\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"b711cb4238692477cc28e42bd5e6024d0f6de41d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v8.16.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"8.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.0-beta.0_1586955522487_0.2554981536828371","host":"s3://npm-registry-packages"}},"1.4.0-beta.1":{"name":"@apollosproject/ui-onboarding","version":"1.4.0-beta.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.0-beta.1","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"adc2065f680af18eb6c053a055c18b7faaf9093a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.0-beta.1.tgz","fileCount":70,"integrity":"sha512-mQg0LSfA9Q9j4+2BRjN3seZvi36rY2pDgAQ20OsSOgcC89MW1bt+sX4rDhzwYGhVQOSSy5+Cq28z9M6z+XRj0g==","signatures":[{"sig":"MEUCIQCFqlWfK/Wz1MpNzyTZMCjRnnKPjiDeLoKeeeI3kIaCdwIgVE2nNJz+G6vjt/628Y4bVAcfc4VzhA6yksja4K6mXlg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJemhRsCRA9TVsSAnZWagAAcOMP/0B6O8Yh30CV1nBHq0yD\nyE+frnNcvjjTYAHlsR4jRxpcuyIDWLvS6FhzozbV6OPz1s3xgFOvXVpdBhl4\nKnyEkJtNN4pV3E6gjVPelBQyjqreX/yOtkryCa+X3pC7CowwCA2xF5BhlAvu\nSQTaUYckZpc52tcpwwwSkiwwzZ494F7Q3CH8aa4Y3v1AwyDJDcBCpU/Jh1k/\ndpMHsvZMyBFwWY63TrcLiCM8MsHJBT38FMxF4BgBjrLtVjwwgwaLDnt3/Ueb\nVbwJZYvovJBdYSWlxdTglQcPCofkoJT8P1vem89bjwZ8rlCYSWlr9v9p5YH0\nRJSK1+NmBgByMmlKZEqDThtYgnn+HCHhd9PotOROXH2jF/V6Jvjf3A1J2Coy\n8FWxjm7AjbGNfnMGNx/Ya6vJu4wgmHiSgHdR7/4wyvKvgPxgHpRibgprVVu3\nUhEGj/V/tbSOa4a7dVo95/sbgu6X/Co7QXGgP4BeXQ2hgelmwhMKn3D8wFIH\n13qwqLhiXqFMOP68a6ZxxPadfFW4Mb0pZFTm/QnqMzlVRKA9yTpzJ9bEYcib\nXbCwYKF52GDZ8DGULG2Y9EKc8fJeBzSBbkoLgvtxUnpBpXAfMBHvpZ7Y0WzI\nQkjxLmxnzaF66ffXJcuZgV13HW2b1j//LgiB2AAAmQ0Y2uSILNUQfWkVGa0J\nZQHp\r\n=VQCs\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"fef450054fec04328c91ad31eae9fbb00e9c13c1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.0-beta.1_1587156075511_0.8882475657935889","host":"s3://npm-registry-packages"}},"1.4.0-beta.2":{"name":"@apollosproject/ui-onboarding","version":"1.4.0-beta.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.0-beta.2","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"ae9a4d8e282fd113f4215183e963e932717c40eb","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.0-beta.2.tgz","fileCount":70,"integrity":"sha512-uJy20pDLZBGpQJQ4N4sG24gRBuhwSf1hDyxsp8/Kcu9xHBv08KYxiHxCcxmMDv8kaXY1nQM3WkIsf0qEI9wtYQ==","signatures":[{"sig":"MEUCIQCP8uby5hsGZB1Cf4VAsuTGxzGVpR6fujTlY4vxekH5CAIgFOjLjQcnblxr1nAGCtwtUyJBM0CPMGzT4awK/T0WQUE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628088,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJepxhKCRA9TVsSAnZWagAATj4P+gM+U49XuX9NfJgRBtDv\nJlTtguxQzdm0qRqOAPz+H1FTpO404YxKc/I3CEb7fUnbGEHk8dlzGLPDgF7U\ncvr1zjSLwq+dHl5aEJl+ApH9AHJXQUy+G7s6/FPQuOef5PHa94xY2FVTL8lp\nRThKbNSpPnpEYTJGRgU9AGV438MpCT8mqkeerXECakVzwKYjqeZ0/gapZVB/\nexsfYyaXtt8H+rD+oagrw91+l9PDRQJJPDRI1A8pgTgqms8ZKRfOIqONJGtV\nHjfWq+SfpMNKKNJqkc86dFmoVhHeeGFJM52FOpw5JY0MiegerBfXgOst7+T7\nJUErJXh8z6/swQvnuS0pcBOoSQ7VWCgLmVTZ+zzVhzf+h5SEmFMyyd4ufO3y\nAH/UT3TxyI16Oi8EEN6F6MGU0yHFa3IElExRboxSH5OfdcK0Qx5FNyONf3sk\ngtKb8yWs+jUgOSSQJZTFfdHMdIwdbhgd7M2ZI2X7rZRL4/qAv8SCdEKFrjd/\nwMOkZkFygXa3jn4+MzP6ZlS7DViRtRt5A8g6e6ijzt2LL0FfxmvjoU/j4cl3\nPX+2UZs21tO6ZrV/iUh+KazBCCjQD1jEqrZqgQmmpGdXEgJMU9KJgS2w5sbi\nI6Kyzcb2cp1BKQacFaAxCloDdEjS+3M3ZicV1Py1998mb+yOqMl5dhnRVjGz\nimMx\r\n=4DY1\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"89000bb9ab25137066e42dd669f8be945e1e8a07","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.0-beta.2_1588009033616_0.972288485094603","host":"s3://npm-registry-packages"}},"1.3.2":{"name":"@apollosproject/ui-onboarding","version":"1.3.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.3.2","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"427caff45cc11f790f52ac24ccd71b6fa9aeb9ad","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.3.2.tgz","fileCount":70,"integrity":"sha512-IJZXHN6y2EShgsLgghTCPfnSGMDT/NdC+130K+C+NmmoekdbwgDXJ0g0fBmU+k1rjFwQr10VqnWEhO3uzvGfew==","signatures":[{"sig":"MEUCIH7Cj3w2pUhTze+mNS9w2z/SmByMjCSYs1yFUWNkeXhoAiEAhzJhUAks5r0ijq2pWxnvy7K+YNp1SLjsxhoyvFLocWU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628067,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeqGDYCRA9TVsSAnZWagAAAK8QAI/FOIMHGXeHyfsKj+a2\n1mqR+xpGG8/dnIEqegmDhOw78uiWR+sbmuqm7PtWwbnvLOq2LLTlmasmSpYZ\nJKxnwAEQ1eqZH58Vm7Ma9qjzQMODc+XQKMRGEkmzmmR/pffbiHJq2NUXwhBP\nFPl/ExvziIJ5ZW8ACVu7TTWQiDkC+STURkNbqaaYiKJPRuIO4nL8le2JkiQ9\nWXorX5LsRqv0AMj2DV3LUGZSeEVgdvIQ/q33QgRzE3/bNCl/5c+WMJBrN7s+\niYfuKxslaRa0wVsclMpy0om/tScwjmA4WUjsDG6f/vnvm0MMp6SLB92ycRcz\n0zKWuOZmG57KRMdz+fZaqY/htURcndPZMWBnLKAjWYnXTv8hcaMGARpituDf\n05yUUvMduoKsT24AfnXgYiUmXMUt55MOMJ6goFW39wgO4N1t5Vz1oWUlrvdS\nLRc/3Ra7iXUldM6a7LCDCF8G2zWSJJvQwSkzqivFos4N9GrctBxmSMUscxY3\nOyAgV+WJDPTRxDJfG5ZLptCgAbptH4kBNrW5ULAU/WKvmAMFmqFC2yBUqHj5\nZB+O/zKmpdoIVcXvx9Dzo55XuAjnnLaZNKAKbniLXzla8XE5XLQQWvshM6cU\nOnqW+aiMThqknBGd8GAvrYuLCJa+z93mkIJDhLVb5dJWlE89OWswVtr96drG\n8A7H\r\n=Obc4\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"6d0e0658dd8f36c2fb2c2ce32d72d13ea4b35018","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.3.2_1588093144049_0.2027207277917007","host":"s3://npm-registry-packages"}},"1.4.0":{"name":"@apollosproject/ui-onboarding","version":"1.4.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"744b127f3e41135161192e77ddb14a2a32e62943","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.0.tgz","fileCount":70,"integrity":"sha512-X1FkAuc2mGPJp9LQJP8/+fMPRWX0Nz+MeRRzvQgWgNbUJPcZiXD5ommVYHYdT0So65HIglnvMw6fet12TY4iHQ==","signatures":[{"sig":"MEUCIFV+I9q+CnLX/esj6mLp37O9Fx5GHsN3Et9rqLRhh6V2AiEAyN8dnAynzC1DKkvI6sw7N5+nGobO03e63sioc20hyd8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":628081,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJesDXyCRA9TVsSAnZWagAAReUP/2VTusTAESv4NFvH8GAe\nfW8WghhlJCjZ3Tz4MZeNETwm1gxRDJ/tnGqJo/5vzPTwYbpEy8iO7j161zXG\nt2fVhRtSpBvWReSUNZAHYf31rEW+v5FTlD7+z5dVZa92vAxkvL5eVNEc5F2m\nkeVimhbJtcuojAh50loU4mypuf3VvAqHmZhyiQlLoxP0syR0y0EibDUyHzg1\nlKfKcWCTFX915ijIUa0+jTkiVGuOr33oCoVTD+o1DAmCrLJltJ2V45SlQcrp\nQBX+i59S/lVo67EoxKbS4L/F129NFR4g0N1gyfAhwN1undrYJXjxFl5Dmpcw\nprlgP1KDHE5Q7md+KKyfDUaWTDizQAjpXXkLFzmTr2Ri/3AcC9XJTbsQknn/\nctTgEMUzJ1aes92ro8+XW6BvV5CA3gxCuLNlEhKccS8B5L07cHUz3MxuXOs6\ncet1gQVUSzvRf7+Qner6lsqcXyzxfNclSFxIfkxi6BiM15J22LN9R0lT4WVw\noWiqS8v0dILMJg/JeOuw9SSXVjSK5WFa3KX+InTH24zHh+GSgf5KRbhObufm\nqQBHPu74ozPZHC2kj2cFS9Fm8GRpMlXolVYJFjRzdPw0LDNCCGPuvWeheT7X\nmMFC8+tFIlvIU0+Hf18W++SdPDzv9niyzTLcnC1XqtHfwpVY6XI6WXleOxsb\nsgPH\r\n=g76o\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"292c3b704f368fd7e6508be7ec28bc9c589f4c66","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.6.1","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.0_1588606450265_0.18024079275595506","host":"s3://npm-registry-packages"}},"1.4.1-alpha.11":{"name":"@apollosproject/ui-onboarding","version":"1.4.1-alpha.11","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.1-alpha.11","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"ca6d1d9e4e66695c8c83500cbacf649df4535e45","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.1-alpha.11.tgz","fileCount":69,"integrity":"sha512-86v82Q+yt9dTFPbtV/opvrpusN6qw3TDxjTPDY/G3HAmKTKKXOsh9Qk74Dewi2YfrRzjOKCGUgu/diCA+f5PYQ==","signatures":[{"sig":"MEQCIBgQzEmiTvnG3uVgHKmwPJ+uSSGEGbrWNS1y3h7TbJHZAiBZjzoIiF5MT8I26uRwCAH67QgINPWFj25Ja53AVisskQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":621950,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJexYZgCRA9TVsSAnZWagAAXwsP/0oYZFW4BxxvfkdS+lCO\n9XdWHFb6+qWD7z0wzWzB+qnz3dWZLG7vF5ZbOBKZpq68aDtYQt4NcBnuIDxw\nbYBBRaMQMnGYkFNzZofCRrgTTpOmz0cwgJJAhnjjwBD1aCwV5c+olYmm9O8w\nd+sbSO1G1Ve4hWNT2d7hBxWEoKJMiA0Xm9M7xYMTpILtey0MliROkkRKUGLR\ngABHQrdr8U0nBnsm4ZwAXZEa49XIv5xOP5gctwUPAxAXoWrdfwRjfGCl5u7C\ncgW+vsJV2MCcJkcgbajy/3Choh96JciEbEKlm5f6ZztKXfeIUdnBrMavlK+x\nl7HP3eSXt9cvFzQ/gYK5Iad8YfuEKPYyO85BTfVlk20WbJ48X/8m4rsaANZ9\n0WubPEtLGiNVtcXaGSv34CoAT3StUfx9n8JqId4rSvQfWu0/njQ2zoz6LojJ\nY7vK3x31JoXgnyKbGdQE8/R9TC8aakacIvb82CtvKA17d9Bee2N0PExEaTxQ\ngbgxF4FauKp5WZDM2TKNdtmGF4569gD7M+KRAdv53DWr6o9/HqRP6qWF/JIx\nkk2MyPbG0y8mFElb+0eGMCPCOUhRkudN0tKUHsNPTE4K2ncmncXhZ5HCTfqP\npSohq7QSXf/tdRbbrqS2pBDzvvRt8cXxqr6mH0qwHOhAnnahBMh3KCriNE10\njjyV\r\n=vyjo\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"51b0a6fa2c1122f0673940adbaaa13be94610fe6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.1-alpha.11_1590003295629_0.37153555456277276","host":"s3://npm-registry-packages"}},"1.4.1":{"name":"@apollosproject/ui-onboarding","version":"1.4.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.1","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"8cfee754e685d49da9808b73a58c9c3f0084dfbd","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.1.tgz","fileCount":69,"integrity":"sha512-15KNiRk7AcnaxjUv9a7UNuD5TA2VOq3eNoxVI4yqvdO5Z3Ry+okm78EvGfXmQve3f+QnIkH5IIvODlYRfB1mmQ==","signatures":[{"sig":"MEYCIQDNhnkPHfL4t22racNbHeX946568gbZYoJ8ShxG0tFsQQIhANjrKpv8NY0cQZkGupjQfIMuLWkmv/svLcDkkLFOat0d","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557398,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe1qBICRA9TVsSAnZWagAAcFYP/R8mtBDiV6AV3xFtyuBN\nnudqm9ChKKY+LYmrImIKax6PNsKGF67iHTtHSmEvfhK6XN1WLxw5NtWjeyJO\nfUFcv0/xaRJixuJYRBjLukwXbvkX6fsVXbDQ/fZPzjqTzvBYjuptVJmfCw6k\n0iJzt3xYckyD9JUjs31uWQDgjJaadLWazFcFQgohKuh2H/zdRafupv2b2pjK\nGFxTL4LNd2M78b/r8rY+MgGr7J8LaVd/6YJTwwxPH6mG5is9wjpZ15mRBvzE\nJUronRj1g/yn2BcR39WSQjrXmvXFvSi6xq+q0ggy0twI1fhfSaR78dP0StYh\nWDy6WCePpXicyYULIcx7AyAM24Ym6SpVJKIUaoJgRjJ4Z2tBSdA1fNSQrKAc\nBydSTKXtEoTcmsrzkNnkgHkmta7OhyxeZY+9JhRR65JJLEQaC48EUkb6lsbs\n0VbzAjdKLHFYfakxEpyhkKgNrmqRDSgpNRD5Jj7hXCAAhSYeGjQ2QsnRTub9\nhc8RgdjjrJ9H876VFdT51DIj3PLvTyzrppqyfa6t1DDbxyPZjOquElHZSaUg\nlZMcqCnGPrTNdS6oHfiTZfygv/DouBS3uQK+cbXqIi9/o07vc6Xly473cd4I\nnscE5PNb2ySt6/S7vMfKPA+uHYenfHeFTms9CBJVCbzTvsvyhkJLVHcDYgut\nLrsL\r\n=6Fn+\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"a9eb9a34c398eacba0983ac74dab332779a1d308","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.1_1591124027967_0.7616099406348948","host":"s3://npm-registry-packages"}},"1.4.1-alpha.16":{"name":"@apollosproject/ui-onboarding","version":"1.4.1-alpha.16","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.1-alpha.16","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"6442e1f9c3bfc7622ac6215371dc1ab00260084f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.1-alpha.16.tgz","fileCount":69,"integrity":"sha512-l0u3yNlwN+J0np7CMUvnysjI/+3qYTvcioRS+Ywqm+CapSxWl8shZzCfXCkD0RRcrkPAvZviirW8gRKs7M4DZQ==","signatures":[{"sig":"MEUCIQC/ps+A8K25JRElqe5yvrmwvCRef0pY8GZr/T60J9FiiwIgbNklVsqH53TUsyKPc/JzozCf7wA+E1nxEwHzCTOaiaU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557415,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe1rUsCRA9TVsSAnZWagAAzrcQAI+tZrIuqhINUbfVeMSG\njURtz9Yvr2rYCq87IiVCShGmoq+6OaE1ha5VzQr++bkSIBspdICm1bsxRecf\nShErQN5LwzH/guVtj3ybOU3ny46gys6zt3G3z9bccPC4ij3RPQ+k6xsHnTw/\nvFlvbmB1aIoYlKekUPWzji42PnpR2aV5dNK0C+x2ZsOfwSSPi9YbV4UCPMTC\n5X8nmepb2X5hueTMR/ou1pe3UT6UdlYOHY82MfkeaWXMSpe5xxCxnF3PLy1C\nL8hBe+3eO9FOAvvDA174d6JX0fO5EsnnCFdXuh3KarhGu+5BJ//i7QRflvw9\nLIh6yFzigODN+/2IhPcA3gUf/HUTBmgSOietie2ZAdsPNG71SMQFLHfB0DXr\nDeiHN6t1prJ056XPKzBiqVDOr4QE8ogLWgdXnzEBaEOhlS5bd2iSVsUIo5KM\n9h8NMwGE98aAtv3W01QmBaarxTnuxujtCDlC2TdQpSJiuUaPnkpQa2b5aDD1\nRClbGUHv4XUknmwPggkqTHCENdd/p0JzM3xfp/0IZqz7ys8rrmH3l5o9Gw12\njRm3EWdFwhPoNWqeEIYEETjcOk9heNeQCML0NlFJi9ZMlAAivL4+TWERoTvy\noUqwwK/FZQP+sP4/hzbxG1pm0co76HbdUPmaGO0VNKv7UXzg1KbXo6t9WmwH\naSOe\r\n=qSMB\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"b00ea24e997f68e501f0286312a7313b818ed161","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.1-alpha.16_1591129388452_0.7114918305880287","host":"s3://npm-registry-packages"}},"1.4.2":{"name":"@apollosproject/ui-onboarding","version":"1.4.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.2","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"3f9322e72a0973ef652cf1ff0aa1b0b7aa567e8f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.2.tgz","fileCount":69,"integrity":"sha512-bLFpZvjUStCR3cO83j9mU4Z0IZjVPSr4Zj2eztx7wnvBhGclHlQDHgzF36icy5Xl4zeoM6tejtUhaBrBIQhzDQ==","signatures":[{"sig":"MEUCID1ug+CRAo1QBoU0KlyPTPkN5fY0tXtCqzDje+dnXNNmAiEA5V3ZWWWgbhV0RvHP7Zp1F/NIhy7P2zbhs4A+nl+ZRn4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557398,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe2mPjCRA9TVsSAnZWagAAzRgP/0U7KoygjKioCdXTy5O1\njAXYG90VvEfRb0jqWoJEKl6cRy3h0Am4qHmMGN4h+zm8IsUcQFyAbyTJKIhP\nkAd9vK0V0CwDCJl/cql4db7vDgEguRhIPWK/LCfcQilNC9jI67Kjl9l1UpsQ\nyghjaf5EIOX3hptVkJ1uouYmzakCJKLB8/IqROnKvb8J1eMzmDFYlgM/5wD1\n/9dXXVUnb/ONBnwHT2jGLwE5AWWKSoV7z2QU9R36tZGpAfC/qKosv38XIANK\nKjO3McHnNMQs7bYqLvaqgbtltN/W+Tdf3AJq16jmzF7EzOmMTSfkxrIvgzO+\nYGDo4h0vTZ7CzxMwtzV//V8zfBIo2A4I/kVyLdC4GCtmI0HidO9ieYAfL2Nq\n0l6rRGFZZdUEp10TBZ0zJ2qnJEzAR7yt/R3rAYbvOhYqMX23yPSbqub4byPJ\nAAuNy+IRdxP8chlQNMp+hWCDcF74+36N3T4AOybLmcpUdrQku08Gbd3S8MVf\nwGPL3ff8bdsORyZVyAmaMJ24iLtvPqvEvoHKrRCjTUP3SAUkwvSPYCTAo60t\nTj+LqIBoEm3ItYwf5XWvGRemxSPKbO8p+vloImE8nbhMJdrGOe+iNUPHz//e\nnlmAQIUO7rvSwW8NxdHQjkAPGVgmg+3PKaYal9ork8o0bbJ0dNUDigvlxbXW\n3xv2\r\n=Nu2z\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"fe3a14f76cacc84ef214d81a6823fc3c1e398774","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.2_1591370723232_0.46955626692807373","host":"s3://npm-registry-packages"}},"1.4.1-alpha.18":{"name":"@apollosproject/ui-onboarding","version":"1.4.1-alpha.18","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.1-alpha.18","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"de7d7d030a1de4bc0a5b0eaae8da13aaac9b6680","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.1-alpha.18.tgz","fileCount":69,"integrity":"sha512-Yzb9ZzZMx1Xw5nTru6gtM4oH5oio1ZcYG86uX+bHXgdwW2//gtsBFzp9Dse1JqcrQgwBCdmiryfRSx0t8f/XlA==","signatures":[{"sig":"MEUCIEfTgQq9jjE6NETjy5k27e3chczA2MMS5rY9Dj89y7oDAiEAvAYpnVv//sRqIVTOZJpX81QqYyz9EAc50Arh+lnsamg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557415,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe3nQdCRA9TVsSAnZWagAAIagQAKP50vSxOim/OK2mpg6+\nGs2Y5MJg3JddVCYY/9Jp9gPBAjjgrvmoIk2csoHj2YURLDMLAskFru+Fs09Q\nTWa0WzoGH3aFpG3s+EnBrcUUMwPNRfoWlMFxl8gTjB8ZiiMLpend2qKYOAe2\n3mJi8Adu/zfd3j/w6HWpLJUS2fZAKmLo/IYGGYuomzzlJ07077ZsUU9TD8ik\noytsu14g4hCBNuqPFDq3tn/JOLcmiEeX1TXGzFJh0Dx3TGRAhaVqeeeCuO2Y\nYJp9dddT+in9A/t9eD7Nda/7S9FVWL1tGvoCp2Ibi4yDIZHYenf2soz0reF2\nn1h+UUTf6oxCEZNtIe3fJbyB2LGWDbfXQiQkFtJkwAFRvF5QADRD0jTvhXDa\nnrFQ/npRaLvtA+m1AtqW8KbjT3Ce1sxVS08bt1YNKGpM4mFjlpRjcMCOhNbR\nQRBO6tLAgk36V8a9xjJLC/y4R2vnVLvCMULxVX1KDueTnyKwG/7/CO6Sb7V6\nEZ9eeTKJxpYFzYK1kHp1/UnlWi6NIfMTOnF2W/R7uLiKsMjxWGWR9mNBczKt\nusYISmqpAI3EiKNiDIEBTKPPCamQQxuTgXvLQfZQZaC6D5R7tYBZVTyqZRg8\n3WGONQ1KdsWTTc0jSa3YnqxXhTAYj/e+8GBBgDy1OEJCXC5pHNd85HRP0SZe\naMs5\r\n=UEw5\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"75b62c0d4f984343ce46c83b0cbe8e829d56dda8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.1-alpha.18_1591637020495_0.6642779496117359","host":"s3://npm-registry-packages"}},"1.4.1-alpha.24":{"name":"@apollosproject/ui-onboarding","version":"1.4.1-alpha.24","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.1-alpha.24","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"a2814e1f5c0488c649fa972cf0258348eb613846","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.1-alpha.24.tgz","fileCount":69,"integrity":"sha512-ByRejrFltnAVcGomTLlWfHbnlr9a8znEE0vhPcq3YQQrjoZQ7bXRvpv/ERVC5Pv4kq90ALEd1riNsyZx+ouuSg==","signatures":[{"sig":"MEYCIQDcgW2l1trHLPvi1K8YqXyaoZJrwOcLg9DzbPgieJLNDgIhAP0FFj0ZE5ACtYGLPNwTNMdetlsj1M/F4LkzIJ4BHbon","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557415,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe4amSCRA9TVsSAnZWagAAW4EP+gOVTEwaCIZdc071bAsS\nsdMlv43KZDiMG7iQ7l7qNy0/OnN7UiPCoE08ck2JvxHzoFHWhOF3X1EBFrq0\nUQgEmqvDcuKKiti/FWJbXBd2kmsZCac/kSTR96rCzpxC34EPpSiJuxh+mgcW\n6dvq5jHNzPZ0/UfKn71NZmOUsz4Za9tkZX5iNvUs0ytKXsDdz59GSUAjDLbR\nf5i0+EQiynVuLl/EAqJvLFkenGAiord4rq4tyhpJJFXDNs0OiYOPHc7cZmqA\nV79K5qcCLhGBpwDrdfVX2/q1CQfey4QaXoqpezYCan7bDs7nUUfrZWkSTzIk\neV64JyV6B7X6lrnqTylnxxV4MenVwB6fndyDt3dJDpDo7I2M9xSOYqd5JM2J\nA77CpEmZDKox4I1tSunRHxvzI2Ff0kE0Fwyum6m2XlrQmWZKU1ejPZdRdSmH\n1DvYqgiWRliN7YdlumukBGSh8BJLn6MD0nMP+rdEoOUXMICkuYTJtrFFVPhR\nZ/939YpLi1OZmxsKp7QTvQOFLH5dKVQTmIGsEyXgs+TayPWxBKh9afJ1aXpj\nZzgRUcBo1UcJTSRrZU72wJGnKOmR8Wfse9lpBpGCAoc/2MTaHcCAxWiGUlWR\nZogPoMuX0Kk4QMrkadrecv0EUrtbD2Vxl3PEBRLhtV9HkYGFZrIt0LXOcYbk\n8ZE/\r\n=EAwj\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"cfd9373748a59e517e052a4974d59a88ebbefb01","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.1-alpha.24_1591847313675_0.6343341179227675","host":"s3://npm-registry-packages"}},"1.4.3":{"name":"@apollosproject/ui-onboarding","version":"1.4.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.3","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"cfbd926ea354da0e66424eaa0e380bf37690c9a2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.3.tgz","fileCount":69,"integrity":"sha512-86pceA09ES8L+S+U0+qKUxbCs03PKAhx6agMQS5a9hECfw7hC5/T4gOnu50uuxI+9wmjCchs9VBR5PlEEXxS9Q==","signatures":[{"sig":"MEQCIBhH4b45Ur4ApB7Xs8TOdUg9lmy8ORK7YvXscwTPj1Q5AiAqOXqs4rMO0uKjJ+6nmqdopXp0AYzH0sLUeP4ry0RnOQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557398,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe8RvMCRA9TVsSAnZWagAA4loP/3OSJnknto46Wo0cH2j7\nU1iR+BssqrEx/BdRE1xaVsQiRwpdaZKgfv20mgeoprEMlqBDPMGL84t/Rtad\nMk0fKQJ+SOwvkeQs3Ub8T79Jp6BWTXDrooVfl6TMr6L2Rhb06v1gzmq4R0/4\nLDVG2jnGNOxAPuijIIL/s61EWewGpx8n9BWyNNPJu8EoHGxeEcX2XkHidF6R\nJpLMFX4bulEQL+weAb2wveBQ4/NYaX95DnKoPJPz6LohoD14GZNm5Fx9bViY\nKpNHI9vvWkH+3uYwxLXddklIjFeXveCHeqioDxihPpb0JJ2Ch53TiJZowZKL\n21M233lCbNB2CcMlDj2oTornjGsCzyx+zVnZ49+SDNAUB3u1UaUnTfAf4p1V\nFwy1ZBZDxxZaYNYalYv5a2smwR+gfEQfH/tix5uFCCZjF37LSxcCqMV5+GwO\n1BRGmz3o/pA2Gv/C34/B6vS54HpgB2luoKzrKmm08xXFiNAJMFCPNgLiT/iU\n+FdhQO+q7wGIVecAUUi6dsPBz2D9QhKLDdTnovZsHu1h/8PahRvP7og2m/LX\nFb82jWC8P/70MTQPuXTt+8Q2WgtENJRkLKpic0Joj/Kizroq0oyWvfNX1AiC\nQTXnUhTDo76IjGCjkIvnmwYK7fFGYX23Lv3xS2M235RGtb1PTgwV0N/R2orz\n+evz\r\n=uijv\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"bdf561285dd7286e054009d20ca7066200e7567e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.13","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.3_1592859594757_0.8369229400324969","host":"s3://npm-registry-packages"}},"1.4.4-alpha.12":{"name":"@apollosproject/ui-onboarding","version":"1.4.4-alpha.12","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.4-alpha.12","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"eb6ff86d7c9aca056c2e04f59d257d93f5b0bc52","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.4-alpha.12.tgz","fileCount":69,"integrity":"sha512-ASSe71uytd7m/BUrRn2qTwkIM3oKrXDPa8+uFsWAnOjUi8c+rIM6ld6WrveMi3AsGsfrEG+m0tcZIsCSxwZokQ==","signatures":[{"sig":"MEUCICFD02XIpxLOqZvPQ07oifkaNgMMM4WDpP8NDsG/rrk1AiEAlGShIkVfZmmBwCfDyJkAIWnQyV7W57BGRO5MEAcuIQM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557415,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfGZaSCRA9TVsSAnZWagAAm+kP/2hC5e7L5qwDSFwrsiuX\nWQoeEWYojOcAhRPFQS8RLjMvQ+qilkHtTrTre+OVEm+K8waBSPYRcMS3CmgF\nTUnU0ECJ88QRv/ma3FPyg345I0I3zyvKhSoqlIFUGG8bcaTdn56hBOxwoLu0\nplpv18i04b1DaeFqaEfKhl9M+MxTVsuqxNUzjewG2aQDrKgwZmT/4sPWpKBC\nYO5O7HXz/xgSvP+12NkqlO3DiwoNY39EwDDkF+IvtnuaF1oec6lB7iWPFfYw\n7X3V7CAE2CkgY54uq5iDAR/2MQbpulPt+ld0Cg4hPStW7JiTOiTUu8YCGJvG\nKuSzOi9JHwvJmU0Vb2wfGn2HC61t5jEOAz977ed6dPWKA8UngHBT38I59q7i\nKXUo58xHqWFTVI+2L35fRLP2Q07Dz4eIRDd6l8uOjScbJDqKM8NzFi8A6jUM\nzHr7JW7uOh5KjR92+XaMI8S8id8SLGyDdcEZKdng1EzR6Oxu3U2VRQDeAKoV\nOTpgmzaM3UIW6/mTbbYX57OfdZEJlzcRqKA/Idfg6WPBA/ndhPr6xMCckcbK\nivMFhpoL7Rv4YM9LA3NiIgWbWecex13u4XmIwrVNysiIckCxPT6RhQxqvMc8\nEFuCW49w/ef5q6LgU41kCAISQg714wThvlmEorrt+xLfxmpV32wjQPHk0isJ\n3ukM\r\n=G+DJ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"1fdc13460543d3d425543f13fe8d54fabc00ffc0","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.4-alpha.12_1595512465533_0.7068846840596106","host":"s3://npm-registry-packages"}},"1.4.4-alpha.13":{"name":"@apollosproject/ui-onboarding","version":"1.4.4-alpha.13","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.4-alpha.13","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"b29815e4786ae399a90796b22e02a613529452f8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.4-alpha.13.tgz","fileCount":70,"integrity":"sha512-zxxvaMeDsdtPJxnwImqElqSkqNqp3JO27t8IzsPR8VbhkhnT3tBzX91CGNSYEo0k5vKJOJOZSARMRvmCwsxDhw==","signatures":[{"sig":"MEYCIQDAshSXgRcj9P1DuJBZuX6KNove2zl34KuqpiHafkHJawIhAKYhYPQyjBv2RcrjCY4ymWvSaiXg8T5GFpCDI7VouRCx","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":558625,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfGbyjCRA9TVsSAnZWagAAsEEP/jY6dk1xJKWTdqTdo9ro\nVAPEGSCWMLfddyQGOKDH/ytM8piZDCWo4PV8fBE1sBXSVONkZ9GDMbdngXbB\nxnoH0NPoRn0KFLwuKJXuCZWUReUwKi4560AUQhYZfjldMgVBLt/bVgYQccOv\n5VNc+zda8RWTZ61b5RuZhQk33DXkMLbJDGWZG3C3SN1gsGJ2/D4Y1VRr9UV/\nKMnfYPBb48wWbEcj9FiXcGp+9u1UtUTgEGvQXI2YjKMUGGTa6zb0icozSfxU\niEK2K3nF0x8U8GUfQp5q2VEcnewU46zkX/a4Icnr21DxGi+1oc1eePXoSdVh\n1iiXh4uFa5VeRE1SOid3jjEX1XojfQKVIDooEfHuWfzYLpD2WwFobaGRvhPS\nHHz2zDpX5sGb/ouet+MeR52OopGUUz4//yZVHZtgH1Gu55Bq0nvKf9LDqthL\nJCEkUeyXjj+3z+hCpUpAbfmTnxVdqLU2sYkZdfi74X85nOZcL/uSesUCbxzd\nIV1D6HRPINsaI9T3bNCp3MS8HthwEGgHZ/6a72Z4CzRwGRhMWYLiCG8x0scG\nTkziM+nlr+9PfftyDZNUrqw5v3d0h5FTRBAlihaThy4842qGUHGFZCcpagHC\nG3yL+VR42kc5mFAI1ut3gzpF3EjZgphYc7Xd8xi5qPyc5ZCGtmGOYqBVe1JF\nAO8t\r\n=LMYS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"a8b8c880d001ed9c06a06d41a44272b017f359d6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.4-alpha.13_1595522211277_0.6374809369354633","host":"s3://npm-registry-packages"}},"1.4.4-alpha.14":{"name":"@apollosproject/ui-onboarding","version":"1.4.4-alpha.14","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.4-alpha.14","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"d3c0645d6cf74efbf4d8aa386f1825e6180ffff4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.4-alpha.14.tgz","fileCount":70,"integrity":"sha512-p6SdhG26TLsaT6IFqpzyqJbHIukN/VZfJmaNKDqm2wfStKO9YJjvKCIg/6FfOt7JcZnrQ1YFu0Z8YShgZHgr6A==","signatures":[{"sig":"MEUCIQCNeEBP4sEy5cFWABBhysn4U1EK1H8lzqVzL+d1+O6ukQIgJlcfeiI2q0J+cNF1kIFqquVKmYQTHs0hOku8EApfV4Q=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":559455,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfGcDzCRA9TVsSAnZWagAA/HsP/iboaHT2Rs4/qH7v0Iza\n0a+YkQ7S/C24Uy2tkYq/j3hpr3gffu+NySJQZxbTldGIcRYGkkuFEXqPatdh\nkHjB1Cahwg1tJA3eHbkrVi8xrrw3hxyERuuORzdRRodX2SMMY+xX3VhhxJBm\nPiIhGGGEeOcg7QnGRKf8ADfR8dSA7IBUqBxppUgZ5Nr0eAXBU4FGt14oUPrF\nBngWNK5tAIiKnuhEjjpIjwuQtg2NyiStlgfHGRgM6qfnaqco9t4/7VJpgWjj\nKBV59JMgDiiWEDSxbiIchApMNRyC7IL3F8UiX5iFl5goGR8fOIdjQC5SEBkv\nKqVjRvgU5mvdJUizhcqjuscOm1A+yuyRiuiFmKN04zG440jjblMzkQs6z7NN\nSo2D2I5QAS1ikylFaGFvP6A+ywRiOwfbHHGYuOWmr6g66D6kyfcGnXeqhvQm\nR/Yz2CF2zqQlYzw0rMew7ZbUPZCirxHEX9YJaFpHO0JisMGdu/TccWHZr8ty\n0g5Vy1fEV5PNpOvIo2hw/1gQmXzASl2pwWclzWSWHhhsP881SdA2mWd0HzxY\nxBNs395wBkSkPl+O5U9kgDz185Fj1sGaJh5L79iVI0DbS1pUdbjpQntKOCKg\nDlgwqvdOEjHaa6O3dS+RFBTVFkmCPAZ1a1+TpSMDxR94cf0wP2O5nat1/rHv\ncEnx\r\n=e6LF\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"cfdef2073a20ee57f1b9949b7300b8a5430b769e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.4-alpha.14_1595523314922_0.28637057004250077","host":"s3://npm-registry-packages"}},"1.4.4-alpha.26":{"name":"@apollosproject/ui-onboarding","version":"1.4.4-alpha.26","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.4-alpha.26","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"9f65a8b5f5510a1954096a12c7fb6b94064ac7e1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.4-alpha.26.tgz","fileCount":70,"integrity":"sha512-Mk9ZixLanARRNPdboia2Ga9bF7N8Luaw4XA0i6A3PBx+XW0QrU4GEmrb5uXbJYHhzVyXlcK6El/kdO7mYFGS/A==","signatures":[{"sig":"MEYCIQCKR8ccpJ1dcraAZup6nj+tqXQEl8aQFUaYwENQyUzVhQIhAPsaY33DxiVSuY822jFNmAG6ULHP9vQu4OaRqRQu8GW6","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557685,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfJHGNCRA9TVsSAnZWagAAV4IP/0YF+jEx/tfnGGRqJqQR\nZ00zrYJT6pn8pZ94jxmKbvth0R3oIi0apBbXsp9HgZKz9wD0uLG8S55Sd393\nARoa5foE6VvSHPAU1ePouOE1xQAgEDCgkfC4UFEFaMWAOfIrYSxqhauVzJCm\nwmTN2oiYHH9sUSY2Met+oTsqRlMA4L42e6Jg5XCCyLVvbTwS5v6vSZ4h5nn5\n4UJdl1QbszVyb19lJ9WxU2aDMf/4aG6VOtHCpigACYsvlTzmko85FiLb7gCi\ndKJV0x2fZWRAplG3m6gk832RVhnJOM9xrEgbCIh3lXSjyUqGFI/DTVkBWHjB\nqgNira/TEv0Pm1DxuB1B2yB5OplrC7IYdjwa6McbMsfQQYRZ/QYWHGRw+fFp\nEnyoSV/cqpPnH/ySiBjZ42eqp1hTeFjSxkWzYREX5LBskKwocFGb1LB3TD5h\nZSldVbaTY+DAt6lAMBg8pwxbPhl3PwiRwri2uly4nQ0dILZmOGFGge4amnFC\nNCS7o74JGQYN6+wVvTXY9WYhIm4PnM2oZNPOp0/qx/JmpdfWvf57y44suBEb\n2OXq3dVJp+XVsJDMzYET307QmP+o/GAuUs3YTEKwNI/jTaMH2fUeL1w1ecCH\neIr9JOgJrqirUMHAjJTYqkrP+tB0A2qrSxh6NThm+vPbYBC6PRRCEtN46lJr\n6cQa\r\n=4M9i\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"13eee07467c3843052f0c53e6bc28edf9b412ab9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.4-alpha.26_1596223884832_0.5628587710435049","host":"s3://npm-registry-packages"}},"1.5.0-beta.0":{"name":"@apollosproject/ui-onboarding","version":"1.5.0-beta.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.5.0-beta.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"13c1364844ddbac4c5db409a3b0287f3107d8aed","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.5.0-beta.0.tgz","fileCount":70,"integrity":"sha512-5ehV49Z4906ozx9J30PSKRNU77HqdCDkB2RMG4JAFb8KxlTB8iNdUb4X4nf1LEqwMJDiWW4/wodk1TvK/Fc4+A==","signatures":[{"sig":"MEUCIQDxRr0ycHsu9MZKxd0FD1hCSfyndZQSlR8hp2SYEmaO9gIgKgBddiDBwFwjyPWULA+1dqbwn5oQjdEDkWwZbnCmvOg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557675,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfKCRvCRA9TVsSAnZWagAAcDMQAJ0hhpf1J42kD0/1oeWp\nLapEKCDJJS2IuymwQPN59w2KAK6COiSyFC1EdGJbXBYiMaIuIt5hdBcdY7Rl\n04Nwe5cyvnQUmjDMLiF6tsDM9nnLD5PngV6Z3fyrgXTv4dZBd7IG/xLKYzb6\nLtpyZT6jlXyTPuqMjou+g5YXccCu4K2aEsGtUA/Th+r17nU4O5yU2EcDxSnE\nT2JNYPXTtqeGJwQ98A/4vD95VY6oSqSi6MfMkKB69RrgWTftHFarjXQ0XPOO\nXOwaq/kCvxvskmSikzzd7yShqEs4Xv8pYbfmczDvX0MnNEyc8mVA6zPH31cd\nQtOfNWIsygdBeDJYf9mBeEbrKXlnrf2WvqvPn9nG5OKHOSrhibSYoOYwiBDv\nvrtrkBO7pBMQoWba7c2UpeHkkJyKabJBWbdZN6ohOpPewB+gRwLL2e1HYZFx\nwZJcV+9z0VwipcC2MPpzX895GT2TPZkX+mHUz4D/hQUAUY+rnBLJNlhYHNx4\nJuYfEWGU6JlGEOadE3n9sY6fk+Yzake6ymDSPXuM4J/btwb0u+p7YMuUpno7\nVkLzb7Ad7lZRqU0QjnHLr8uqp2hNMfZIeXNuy0JZr/SN3y7YjPAXm7ZViwC5\nR+HCs+IGI6CvLb0X6Tot2BzkIW3NPnAm2tpeSVQ1PbuERP8DcmsMbVYT2BdJ\n20Fc\r\n=bk3T\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"2e17a4083318659c99c961cc3e6151077c77d1e1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.21.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.21.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.5.0-beta.0_1596466286989_0.8758590431441526","host":"s3://npm-registry-packages"}},"1.5.0":{"name":"@apollosproject/ui-onboarding","version":"1.5.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.5.0","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"79c334bc83d59b87a8e7d5d13093f2fa3f411e96","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.5.0.tgz","fileCount":70,"integrity":"sha512-5KpbBs+7b9O0HTwkjqohaCv1brKEV2he573zixaNeVZ1JqJl8d7zQ3+UC6hT1jk0aruj0wdtGoPNcPJJcfGzhQ==","signatures":[{"sig":"MEQCIH3n3tFhyROc5cBBaSlp1uCWFg1dnHyLuVCxNfRUtt6SAiBcpU382HLf74WIaNftZF+w+c0ajhmlFxpdkr7vcgDSRg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557668,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfPBckCRA9TVsSAnZWagAA8e8P/1q4Kgyt33plhYUeED4N\nj9tWKTawaD5RJPK+3aXERrIgSdK7ea7WqdKxynEDz960ZPz9uq8LPGIOfUti\nGyVB0gVJGlW920niCzjZg+YdydpWet9+QfafA4cOIA1jSXAtRlQNTDaFTsL8\nb37xDd1u2papI8pX1q1lhENZpKK/ESnMwCQiSFTtCZAAElSWScdOmRWdtawS\n3rCAz5jL0eAs/+jEEQu4ucXgN4hFcs2D1TSsUN1jibgILZV4a+paJsZRzzVA\naMqRsuQX4WRtQWajuY4fxzlXk0SsjUrrEHw9irnSL33+1VpXNHJ8pftcVFFK\ni+ZhCbdDULtsGGHRutOB+QvU2BlKl+UmXLNwMVJqPki/9YkljhU9FnvXWetG\nGGwTZcXSN25p3Br+s1urYTxZMi299wsbXHlAYQWH98GXIeM4D+UGe2kkXy0W\ngA6vaTJ6neJU3favT+vbEzWP8Bl7HDqoFdhTtHUXCxVLovk/hzqa8HDMVkPP\nrk9b/NMKq4QL6degy+N1iOgPh1xXFZ+0bdj4Se2Jx5fm9J27iO/Ejvgf7D7C\nMPdB3SP5k1ggPLeEzADMFS8wyzLcaEOG64WyXly5QWkIxBlh2fPtR9edyWpC\ndoLb7XYedMx0V44yckxHrAyhBuWvG43Cg6HOpfO8eC/4doOaSC+m6zPrhV34\n1tX6\r\n=LESk\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"1b15ae5ba0fad601321b62084101b3728ba2fd1a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.21.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.21.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.5.0_1597773603886_0.2320755558758092","host":"s3://npm-registry-packages"}},"1.4.4-alpha.35":{"name":"@apollosproject/ui-onboarding","version":"1.4.4-alpha.35","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.4.4-alpha.35","maintainers":[{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/ApollosProject/apollos-prototype#readme","dist":{"shasum":"adac3dfabcd67424c18b48ac62f8a6582afedbb9","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.4.4-alpha.35.tgz","fileCount":70,"integrity":"sha512-b16JrpIOZGqadZGGtbsSzyVde0/qFyqy/Ow7wThUjHJz6yFKh5c528LqSd3f5HKPjHq2tR6gLKKqBV0HSl6tEA==","signatures":[{"sig":"MEQCIGhs+/AiVGtIK8qErI80bPg70PcHcYrB3aEr0k92S8j8AiBuu7nkG/XZJk8cLoQrdt993KX7jp4pHm/Ftr2MJbk/7A==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557685,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfPCp5CRA9TVsSAnZWagAAISUP/3gwm3alY0p0epnzRqnh\ngrU5R9pvQgeayMrgX6LIraFSEDSNP6pxuddfkIuaOphhEEAdUxXXgk85lnrT\nMxyqtb7fhl+eLpYxpcoDVth//GiEFiuyUlkgFyiDahOzSmFi4nlV4LhudwX0\ndlWwiW5CUfjqe+GL439E6Y74pVPjoMOnxOVfSISEQgOHbNJXKN9KhWCEMP3p\nhel7TQ4OahLNPy+L8E1mVBmI78z+MkllTaPaS0xteagnuSVQelqq1Xp6Bh8G\n93u72cVuS567bMQBUrW8NchdeyaMWtZv0qTKjSKfvtTGZ/dYfcbBit4RRMRV\nFDhsHt0jmVkkg60rfiLrD3jwZUVTjTPzgS6elBxCdmqExyfJ7j7VTXrajWOs\nNNSY6EwhMGFalded1UGyQ6h66DHDmwM54m8w90IiTyId7Rt+vqPIMwe8xLXj\nYMR4MaX/SFfVavJHXfe/SYs8D0B0rw4rjC3yFo/rSUY3bwWiUnLuQsAx3eK7\nxKDqn/sXt0P4PWNILwMUlKIp2fsxgAgQdqzS/B6HboH9m2zyilSgQMJghW1s\nIwrJFKZDD+l+9dkJH4fDu6+y8N0NZfEYoQM+kBhueQvXJDjTY4gN9ffl9YdA\nv7Pal3B8D2nQwk+cNCv6sOXxzhGl4ZMGV3M3pQ/0QFPUcLZPWIS1Xj1AHGo2\nb4c5\r\n=fEjC\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"4c9bb1ab683b52530b3a11af194c8cd09d977fe4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.4.4-alpha.35_1597778553391_0.24776100689467673","host":"s3://npm-registry-packages"}},"1.5.1-alpha.31":{"name":"@apollosproject/ui-onboarding","version":"1.5.1-alpha.31","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.5.1-alpha.31","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"41d38c650c9bf5fa44dad823e7d07eafc10f896e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.5.1-alpha.31.tgz","fileCount":70,"integrity":"sha512-TEIYhaBeZYTTs91BkhQh2d44hnWgzazsXiqlUQHGdgyav3z4KbgYZGbRMdQVhStV9bfVizGtYiQzGAniqrlO+Q==","signatures":[{"sig":"MEYCIQCIXbxcEPDMkfTvBMbhzt1AsKCBn0SicxKNBDSVdyuxKgIhAMW7zoE7E7eMuKcXVfPKc05LkMJQBQWebWHQZeAq7/NL","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":557678,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfY3b7CRA9TVsSAnZWagAAYqYP/iecdFfGqhvVacPSLn3i\nBpfFzjS3qTQJ9nug7pjf7nTCczPUctpRfse/Q2GKmnzyUeorMa15E2XF0OPK\nqWrbrt0LfZGxBXXTHC6Zt/p2JhFhUb+mxyktJMcAe/cK3OxmY8MPmZOajx1v\nux/C08LxsliL9C/yKwRRFahjOLNEV1B4eL9IFmd/HU2hRWr8aY3vIv+62EA2\nvb5J/GJ2AjthNMyfSVjr7l0+Fmx724f4EHS1niiUkC9eTiOl+wgnZc+Ghlc3\nHCIIEj3y95aXqryJ33pVdlfjyIoTdHTE9awQGL+AZ7koOvCNECUb5ac5yqyY\nakcyBkTv691Xicf5suahqQEsUFyMiIf4DZ79f9eK+D5ETlkl4tkioPmNMkvQ\nw4uDQIols/bLLBZOf4p/i29J26iY1Vc8h1NfdEF+vUJtg3SUI9a0jxMXR3CC\nI7gSUzP77WKZZ6qM5saZGjh/eQdUU/Lz6wSOTQ6uFNIpy5V52QcDoJjuhBDm\njTM41nqB5jxUAv54MYtObT3QqLP7v9LhrIQL1jkPH56OcWKQ6GbSaoaux/ul\n0HEobJYfxJ/3zQjBV6tu9OJj5Sw7DUXc3uUHhqqn/1/Nc84FCVAy/YKGlj5G\nBy0kJaLgZ6VAboCt4s3pgY68eb3AOhI6jktVtLZuqClRirRcws4EqAqTretl\nfseD\r\n=2iLb\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"8af55092e3d61d66fb7423a5b5b6d6a2ece9bcb8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.5.1-alpha.31_1600354043376_0.3046904787549385","host":"s3://npm-registry-packages"}},"1.6.0-beta.0":{"name":"@apollosproject/ui-onboarding","version":"1.6.0-beta.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.6.0-beta.0","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"64b0904988942ddc161d30cdbef8d4553f5e92dc","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.6.0-beta.0.tgz","fileCount":71,"integrity":"sha512-N6rYKmluY7jqlSM7ShpOSBRjrASnrSrYYOlOcsATWhDpI0O78Iq7iCBI/vN0+/azhLnAooA4rs5VZkupjACs8Q==","signatures":[{"sig":"MEYCIQDbrJ6GRcsskHsSGtGtR+wflqatkVZIR00hst04J2f15AIhANr23AMZhmvcWZrpLlGsjBNZCsJ2UHZFg0yBWrK0+/Jg","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":558014,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfaSY6CRA9TVsSAnZWagAAMNcP/29bwEfN4foPPicx7SfC\nIz5QjYZARFHhK0Vg8eyBcnoCMwiFUUtJVgkpNy3YULX2ORMnmOx1eNqx6xz2\nW+yKvrjflZTpl64qHQpO0HWFE23dCdno+iKjOOvDArhxNyL5FLOG9xKajKrQ\njdlGv8IKD1Qim7fbjEufn2G8FPTpX6OWOZ3ymScr5BJQVWCImJa5BWqu+7Jj\nQMeUzgjvm0o4JAuqvtqOTSu1OHxrn+oYfA3N/KQtZ+MI96XKSU2FgLZwJoSB\n3aQWs5eDBfO/5xJxSNuHUcfiZDMvA1HR53bvwYlZhOsLsqE4UvqP3omYwz76\nJrTHZZAfbzSBelad0ftIwTmo85mPuEg3snQcSJH9R92jqSnJen2SOtbpI0Yu\ncFbtXz4J06BmGKHpqpj/5Ddhmo6IJVhGOmSJa0FkcRXSTs8UoZJIqLuBe8Z1\nbCrP8o0wmHA2vhDEvivJ3KtV2fjKoEDVIWHFd1cUh9dDsRo8Mg4AqCj0OZNt\nqNTGBkIA20SnSCDb70hrRp8qhGkFGgzMIggDfzRCbpi8qw8OhytvFvFGvDRl\nbY0ZgjDJHPFc2Kev+gszSyVSf+Wb6KLZ4xWYGuq8hfc5shHBUqf6GS5Jg7ce\nKxIEJ9O+gq1hdpOHCUT5tSUOXPnvb9zKVgDZM5DujyMsi5L9/9LcdR6b66ob\nFRLH\r\n=mkVe\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"d1bbe6ba5e5061eeb417e481c46e490e567a5f92","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.6.0-beta.0_1600726586496_0.21742982608802364","host":"s3://npm-registry-packages"}},"1.6.0-alpha.5":{"name":"@apollosproject/ui-onboarding","version":"1.6.0-alpha.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.6.0-alpha.5","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"345aebf179338b5e6a373a5a808702e27e5202a8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.6.0-alpha.5.tgz","fileCount":71,"integrity":"sha512-LRr1CnmP++zlLBwBYKydcbP3Lz8Q88SL8dxU+wS2GI3CN7kBpbEssvXCTPxUq0Uhy1Q6yXLHM0mx9wJv2z7DKw==","signatures":[{"sig":"MEUCIDcCvx5B0zOgZcRMHjdFK9ulEMhPKk88mx3MDuL6YbEtAiEAsiP3NY6aFzqpCkWJ7xF4WkLsM9XhlkWhqi93dVaNr8E=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":558309,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJff0mJCRA9TVsSAnZWagAADbEP/RBUZXBmzL64UYZmSr0I\nw9b/MmRlOX2t9ss/PdkGWfPqoIupFhSKaiSBWUfAibHxhdpzMi4JzrkIZiVL\nJtcbL5eqFwFPOyqV4he5TYEDBC1kBepB4PB7J/Mj6ahuRrc8iv/nJo8Ym24O\noANgmurma3p7KG4G0N/ehESW/vKhteAEpBHZ8z+VMcSgQCWrRyH+O+gsrLk2\nay1NSbBM32tPThASkENYgl4EvZ0/z6CBijon8E1ck3CVZkpkdaLkJYzbpl6u\njDtcXf9V1AkuZ8fojJnCKUKF38ERe6Hh3MYhoCLX/IZVK6H8r+eiEOlUGtic\nIAFf4b50Abr04Rm9FaaMQYRVF3UBwIVDD46y7twMcVpQBteMiMNhb1eOfd0m\nbqfV7DOBQkf2y7ArJJyvB1fHbVYU6UME0lh7StAeeUQFN5dwLTQwmYcpCoeo\nJm9DJdVWGYMzFWfZuREE9VoxoXYAaj3HnpBnkHGEWfkDmyVuYjZ0c19TyQBd\n5IItrUSdQ1POUt1j0oK0VZstbz4ARP9sm9QimMGRqSvMW2xtOzCvSypsAGNf\n5EFo8MMAPm5SZpBEu03BqKocgkY00rzAKDIceMwUAU+oX4PlZE9g5GvPMuge\nib8akIHoFJa3NvlbPoKcVSYe2P9cteM7PwGLNte+Ca5ylfJxBmwlvvvwGEwO\nyHdA\r\n=4jDv\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"83615ceb883cbe1c44aa247ebe9001622f881b39","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.6.0-alpha.5_1602177416530_0.6799523010208361","host":"s3://npm-registry-packages"}},"1.6.0":{"name":"@apollosproject/ui-onboarding","version":"1.6.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.6.0","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"0c0bbc2df08c9c08aea50ae1b4911828488e4b0a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.6.0.tgz","fileCount":71,"integrity":"sha512-AOvLGbnRUhvp9BCfyEN3YaWPmDRtqVRSXj3UFuuPR5fVo6OkrEXIpZPPl9O/VIIRF2YbGkQMtICzVL6nZrg4Yg==","signatures":[{"sig":"MEQCIFhss2FDvdJOm6P0mPVmiwmhd8VYReDbbaGU3U7NG422AiBJuwTIqA1W/77FYSW2syLE/xk3UJf1MVBbkK/HYgkCrQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":558602,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfgKi2CRA9TVsSAnZWagAA/P8P/RldVT6N80YVsFxq+Xm9\n7kKADiCpjT02WrJETMLdk9jO7Qvf+7nG5emXADAs962MmWsYGkikChx2z6N7\n8GHxG7Lgo+mNx+Dtg3qgt/Md9TNxHldCV7hQCLPvWQxEQEhK8K7S7xpYYAS4\nXrcFustW+HRLDGzaxFGFsg57TO5sgchWFXmkWpDB6cBwv5F6OIKbXWRpdbRy\nWGczqIhbKE+Z7FbEUtZBEGoLPgyz9cerqK5M4w2jzDhAOrVRDGaw4Vs9eonZ\nJqnDHUdpBzzG98EUj7+yB7gHMWyQUGrzBl9DRGthAKGaF5hGjKyBtjh4z3P/\nLJ8Mnhrgh4AgAbr13Tx5ctfcE9pMmqIBJjKCpfs3NSbxwE43ugbiEF8+vo2f\nFk5zlQeng2povpKGxNG2zDRiOHuWqBnhovtyDq0bMW3+DQleRr3FIFolCPxc\nPxG16QLEf3SoKsrtVHg3PzN0BnhZIG/3DEDUYLVVAHum/dQ2j5hKWMuuEoOu\niYaP1JiLpUY2n6N2tLtrFnnpYCcyKAy68HN+C3coCaizQWS53XqoWdmFrMqp\nRDaBPD7KA+zp8m+F9tCr1sX2D8VQKBZWjyTlyJH2ZdyZp3c7sd7SB4pZViUk\nAtniAe8j22OaWRqArtF2cZxeB1r31Gx9+qGLKUAfTJyN92u07jCwIHQgtBBb\nEd3x\r\n=7dwE\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"5a90c9a943df6c5d1864f4c84ae2ecf04d233503","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.6.0_1602267318228_0.8267697222563424","host":"s3://npm-registry-packages"}},"1.7.0-beta.0":{"name":"@apollosproject/ui-onboarding","version":"1.7.0-beta.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.7.0-beta.0","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"0333b516873c290413292db932165db823769655","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.7.0-beta.0.tgz","fileCount":71,"integrity":"sha512-s6jnNQtqh+LvzqIa03LIee1N8sTt67i2zYwukLmTN3eX4BnHphX4lani7J7obqNzjzsc50DlqxENeK5y05QziQ==","signatures":[{"sig":"MEUCIQDGyQVBnmUuq/b1S2sFMv+SbSeAwhC5fcC54MSK/gNEgwIgWIcmmKVgnYPMW+t4CKDoU+59IPrlhfHCClkkWB3hILM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":558794,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfjfqNCRA9TVsSAnZWagAATnwP/0qWHTEO9cqKkTVD2Wni\n55raqiZfxQGvNkzZ8MRC9WWLXGCHcAJtV2U6xZGWU+ecyExkyEAfe1bKGNnV\nwymHEuxpjqZvQrnnMr3Dpzo1fT+faCDz5x+7nANbUWqqa8T2SfxTQSA1PDku\nq1Zwx5Egx0K+JPoZLi0ge/TRZ1cKxYKqhrd9ipoLuEhZvemClpnqH+KQTN5Y\nmXf2Uof+FWv3AFhJhBImy57oIFmbd/rOSn+AJvwJUcuuHnKraj9kMSgI5VAr\nJ8Wh3pMemaJtLZhF/1cyWni4S25M0xrKpvUOkqQPYOOioINyJLylyxYm1v4r\nlNtaVJoheo93/3JvxVWoEohjFFSLep0Tu+TVTq/xDr3dnPdiHQeTt6GRp+QQ\n1xskyyiyMU8iHj3QVgAotEJHEmY/F8m/0E5giSIfDbbQ0n7cL4GrsC0C62Qp\nCVxKNKX2lFm7290R3X8IZLQe3z7z+Lxr/GhOps7nvYkqTPdGtt1wNsFtM+SW\nOnJYRSRqaxYWB0n9R620FaRWLZdeyc97meMUtVUjqYlfUdeiCE+DP+e/k2je\n0qoWeEih0nRfXJHGakaLTts/17MyoMa8Er2Kjs1CYoAd5eRcycNoNnoxoSdM\n/TYulkwEdpJtICyghbG91eQQKcZWoTo6YdQfSQmr1o7xBTGlDbSk78zbpAsH\n9Klz\r\n=46LS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"9e9fdf046c869ca6af09e708d932955349eee608","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.7.0-beta.0_1603140237411_0.0363754193881205","host":"s3://npm-registry-packages"}},"1.6.1-alpha.18":{"name":"@apollosproject/ui-onboarding","version":"1.6.1-alpha.18","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.6.1-alpha.18","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6643b87be2d57ec315413c8df6199731a4e3d6dc","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.6.1-alpha.18.tgz","fileCount":71,"integrity":"sha512-70qnQvuibV/xJj/GMxR9iVUePEQoYRT/wKhYhleioRzbh6pmho06MYR4oBaB8dHsnnD6//gCgLRbhxcuhZ3xeg==","signatures":[{"sig":"MEQCICscXDWiKE0HyTX0QRs+NQHBs4AZ5+YXGFyaf64ETvGHAiBFyYPaCWGqqLnjDeb01qlBAgfcXMX/NmdtSKfZtuPyNw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":558805,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfjfujCRA9TVsSAnZWagAAPG8P/A9BI4/xeL8KsAmzpwaZ\nhV21rBMjucC93yKsIyUNE0eKO69Xji7W3Z2hQ9m2x1KRT5n0DQHJXsCMHzqg\nsyGMSmcs9l5rNjBeYVy46VNfH/V/lBaknh5LBV/zENYs1E/g6kECdgfAIY6w\nm3QO0NPxnZ80kItSvb63gj34DMEXUCHB+rAQ0FDG3jw+n5rjUcztpeHmO09C\nSHndE89/EQDhpwdqh4/jSHhfJ+OqPO/TFI8gY/y50GagiuMAH7rTpsyucfIV\nTJNzGkkhwr8anH6L3RnxE94ANSs5yFwIHeh2wle3A04wEXlstIcYp7GdROU7\nwFXs+YbC9SMPeIrWRLpXbvKNmoPMi8FTziwdRExkw0c/mf5KfSVEk4iYuhzA\nAEGnZeg/0M1jcJOWG/zbySRKmP/c7qmlEi/keAnZ3zRdGOBy6wFDHhcZfS5F\nEdguYaShLMY1AS3EQ8+Fpl2HcsmSEMYO1uD85vIS3mUPKyVAoQBCBpshB0y0\nAiaN8e/xbsBHwPvILdy1Z58VDHqMDQWF/rTPesWpH4WAuhSrhDKrszDMys5G\n8OuZgsjO8lcZ3X9kU3Pmk7ZTvJ6+ukjhHe/pBHtKOrHHVvXO6qCkLLy6dqN4\nlwuHOgZw/ui5HStW8XKwp/KdX6iWLeNxovMusJDs24y0RxnfIMS1xGUsIUox\nl6Z9\r\n=8PJe\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"9e9fdf046c869ca6af09e708d932955349eee608","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.6.1-alpha.18_1603140515397_0.838188122905793","host":"s3://npm-registry-packages"}},"1.7.0-beta.1":{"name":"@apollosproject/ui-onboarding","version":"1.7.0-beta.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.7.0-beta.1","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2a7814358e8fbb7a65fd8b94666780701235df4b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.7.0-beta.1.tgz","fileCount":71,"integrity":"sha512-Fd76KuktAVbFp83G7zgQ5Ykk1wGuQK4pDUysHKooAzKjBzBzoEDRNjZxvua3T/dBMf9SVHOFCJQJfR2RmKqhfQ==","signatures":[{"sig":"MEUCIQCXNHHiyIhpp/vtJuyTikwLydjnMTvWvpwaR6HXykYvKgIgZJaZ10xuNRIyIWwnduTNAxPJHGWTk+KIUYzEF/izs5I=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":558986,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfkuSACRA9TVsSAnZWagAA8cMP+wTPJF6pE9gX7fSIXIbn\nQG+1yXTlIeokXdtI6F14VFYrHho7Ce11tJJUcdXuTcoDJOjeiUS/dCmEZh/D\nctaaizooQG6ty8+hd3KWVgrgQCcsidV1b0HjHPnnJKNx7uyR8esP1hof5HJe\nEoGEeu9+/qetWpyQKoPS7CPF6oSRQ79QOsJELS+yTAmtuPG8yhjiUJrHLxVg\nAPowotuZ4Jziz45rmK9KlewbVSzL7BqkVWc+emcQJFas9jOojF/4JiAtCYy1\nQmSsM6j/4upDH3UWaDMwOQZ4vu+raIY7LOugjoTWu4EisGH+teMjJW8mGaph\nLC7MTuiuEp/prsdcyfb2R6YWBFtV1aB5zRkRPFpr7hT5txTdYBcf1ZChcfZH\nrTPSSndkKl40JmqrDnwD6ei6HZzphdo/ygJ4yz5YIM7/M1cmZz7aKcN8rO9N\nyg3r+OKBRolrSVhASKYVp3hs6jl4AiMw06sb3EPtirzSrhzM6BrZkmV0ie+f\n/xYN/Bq+X10o42b59lZofFDWf7Ihyn1JzNerxl8UApgK/56HBqdF+soIDoPD\nqiNzMgW/G8tH453SQRz9Elp16hx4G8xPzrTgoyfvnwmTi8lHeE2EEkdfF5wa\nSYzESEC18WVc03GbvK3uYnG/MxWAFq3gDXTWDGh2JKKseAhIu41cxwxTDYpg\n3Tc4\r\n=Fmps\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"5c37bd540d9ee72dfa8d07f90a377a97bd4a6ac6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.7.0-beta.1_1603462271888_0.9019152552618517","host":"s3://npm-registry-packages"}},"1.7.0-beta.2":{"name":"@apollosproject/ui-onboarding","version":"1.7.0-beta.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.7.0-beta.2","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"f9f50edeaa2615f60a16f79a73956426d0b78640","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.7.0-beta.2.tgz","fileCount":71,"integrity":"sha512-3NtAoxz+Is33y5VgCIOvbK+pfCYVQX82jg5NkNLs20w/TGFoayK76BVV6tL+vsU+cRX4fFzhrTeuYKS3CndpEg==","signatures":[{"sig":"MEUCIAqUOS6UuDbj1r8x2q/F4EXVReIQoXnz5e6spcsHnfKEAiEAv+jdqDvSQopN6tDB1YUwpmQeh8DgJcKUdNyjjljtAo4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":559178,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfmCKgCRA9TVsSAnZWagAAFocP/2PntY3vAEVA8llT95xC\n+bz57BQyIKL/dUpZZbVgqoXdND8SgifzX4smrIrkxILCMXP5GtQ0z+KsR42N\npuun3UqanesbQbAHC/ph87+cK558bS+DDWWjSI5gxz3UUwlmGNP5f7+SYVns\nWDvzDSzEWNqZYHjveVhFE21DUm+Ke0DXXH67+ODwIlASz5MufJtNVChA9/wk\ni2EqvQ5V2m7bUbH5K4oiUUvj/VH1+yJEaXvglMn7fHG4cXUV1TWPonJnM553\n5HyAVnxtNshaDwQpiE64k58J6QHAw+cPNE4Tl6ChU1nOVXexICJhaXXcT+wb\nN/e2PKe3s/UYk1PDE8jZyKK6yrVRgBWOudWuwvAS6yKIi4VODquV+Jn5dMEc\nXDEdWz06AGpr5f1Uw1SdvvPRra+GdjfgcXsN/n8jqaseqGgQlnM2ywit8J5D\nlxHxMAvqFB/rJSFQuMV+Lj7+fI1clpsvvDowNQjoma6dau4mCbCaHZlNBd6y\n6zmhCC4W64uQUI+Blq7RKq44s0/7pp9t7KDVgLLQsirAE7Ndb+g2Il/a1vlI\n/31djcDte8nKOQyJAYmDp+SMeE0xS4sOBwoZXi8QmVpAqsX2sIOrSnUTJ7BG\nPB2rioWQYPM1zsIPiyDqCBo4m04SkkmY0nTB0pH0PcWUzobRFrtVc8rZddwH\nllp7\r\n=jH7q\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"a05cbecc245689cfd35b48e3ee777a605ac5c03e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.7.0-beta.2_1603805856462_0.09501391347053079","host":"s3://npm-registry-packages"}},"2.0.0-alpha.2":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.2","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c4caca82723cdc6f86f31f9ea88d4a8d6104ea94","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.2.tgz","fileCount":71,"integrity":"sha512-hiv4D89drnn7UtBSiapf3Bu5vlKIwXtSWwhOag0jv8EUUqROwTCLrM0RCOvs/1Nnuft8j+8I9MBwoED3D2QyZg==","signatures":[{"sig":"MEUCIFZlN7/IRNEAC63vD9OSckqcOmp7GbLQGX6xEu6b4Nm1AiEA9xjd+It761TO0f7OmnZKxwSCLF31Ru/+MKQnZDXyF3g=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":559188,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfmX79CRA9TVsSAnZWagAAzfcP/jSXMSN3ItdsGyc+7xYf\n1Aw+bumaO3C69jIUA7kto9elOEJOYpQKiONHvWGyeWXxs7A3NCTbBaoz7Qkn\n7z28f5kS38TPckUUDgATSSEM/q6P7GYHNtzqgJJVOvOkETrATmX0N+KzhEwq\nFXJ4q8K2oE/KmgCd2R7R1Iw04uFFB+opEiJpp/Zvz8+8FqSBX39eRuN0kGdE\ngqlTJ/VfEt5DpRpdHtcgrupaKRi4XXjWMZ2o+IAdKz2+D+h/mdtuO77UiEY9\npNBUlIC4EdWBWrBsF/2YzuDXgTLzl+lyf0QR4Nel08vugmXr5L6kQaZBu0EM\nmWF93LVtuCYbUDgMv+k3NKPjRDO95fyygokAzS4qwMD77DVmOvle2ZwylHFw\nQpB5j+Ug4BbpULcYrRfmB4OJEyvcuvypHzeF5aMUEfbmJbE5iifuViMldcAE\ns7T7IjWnU08NQR3qNXN90JQq42e9ETu9yKB8Fj90Iaw4dVSlhIbxRjjtfnm6\nKN0uNaf3QWg3h6n50roL7WZ13JDW0Nr2dD/rmoUByJFY16yS3L8izM0yGS6X\nnGr8+xmX/ZuQ5L8Zpvd2M6JAu3dRsxSBrYBxwRnT1Tvd/d+81iwzWwqsfB7o\nNU/AL80DtIKHfYidrdH1zepJ7nvB97t4fNyIasHOgNeIzu2ABKrXc+nfYwFr\ndSMh\r\n=TuUm\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"a2054794aba47031f8f4082d064b9125fdc91dfc","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.2_1603895037190_0.6998933239435172","host":"s3://npm-registry-packages"}},"2.0.0-alpha.3":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.3","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"feb03ae119ec2f1b6453378bcdfdb3a896b23b3a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.3.tgz","fileCount":71,"integrity":"sha512-Q4mIovmyj76hozzLPC29CM5eGmgG82WbE/nqmnhjVVI9CcWmhrFBc5ImXju69ymRZpukbdEoNbJ6pvWg0sG01g==","signatures":[{"sig":"MEUCIQD3tOMiccS8lxlioGyRuGQRZEPsQE3ECqXfd9tBkaWjNQIgXvvvmZtu6LJqzav02Mt6g468iS4EX1P6MHddywNuBp8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":542955,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfpVKoCRA9TVsSAnZWagAAqckP/1JgszpZnGrAd2uqj7vx\nghEkmhdxyJANleALtTNb8q1Yv69VmG7RgEtVGaoEe5E/vaeOJNsfoKokj4pT\n8G9eEyI8CL0NqkHkWL/bq2mXE10qFJHCdcyv1IV9EYn0hyANzFgjq6lHkDpR\n709gvmNUwTA1lnr0SPZyvmpStTZjb++ALUmuwhnbeURd82Z1PfDn9/NSNSiQ\niEiOnoWmWXPJY7SCFkROPgkKBaFsYVV6XpEjqILQs592g4oggYufyp8RIJMl\nunrqk4Jc36xeei2nsr5GBtv04oCyRSZV7UiSw5j9a2VdtBPEjCnM5FGgubIV\nchTmFjE14iwwDKPE903Cr0FFmPBjLhPsS7GxBNhwPJAjvzSbgIFSjTEWloJb\n2EjRJjiAUM5/ObYjU4yKj5jn+KG23sPPahdtitWfKcgpOlIBh+dAXQyeVEwL\nrhRNjGKsODOQK3UWt2eXcYxJcRtjruv18xKOqVioTiVkTR/RdGmI4IlKcTiw\nfvHcrmXT+/lHiUn3m7u8KvQjELHR5EGDXqrU1CMn6hq/hWyb4O6Hx5ltVJq8\n//PZKKKVd9nR5RVZvGr6fD43iLBDZmerW0JY59jtGRnKe+kJHQmyw7yzDhIK\nKUNj19l83YXTOUqcYt59mgDBIiJu1Z0FfVSGoHFuGIbC0xJAiJn6+IKaQFW7\nbt7r\r\n=k5Ng\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|@react-navigation/native|@@react-navigation/native|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"619a134c2b59d1b2224637bc63cbae5cf9b87033","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.3_1604670119876_0.6475657428309052","host":"s3://npm-registry-packages"}},"1.7.0-beta.3":{"name":"@apollosproject/ui-onboarding","version":"1.7.0-beta.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.7.0-beta.3","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9d384721883b91fd90f4cfd79a64e9acde0ed237","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.7.0-beta.3.tgz","fileCount":71,"integrity":"sha512-TFQEG+yjIVNGh1F0wt5jsT3DiY2lEvZ0bX/VX3JNTs3n1fgJYhGY6wyoXLPGRDpDd57jBcgz0Cld76usXxwk9g==","signatures":[{"sig":"MEUCIQDejomw3RMvplhUyBRLMzkhVP8aKkmcH/rgf0xRfuo5qQIgcH8qBtJ9H6xCpzJzTKbgcY3/g/IXQgu5Mx/yXvuvIO4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":559370,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfqUkcCRA9TVsSAnZWagAAplsQAJ+PsuEhNA7SNwAHUM1I\nku5+Ky4s4RfmdUoWgsJmum/IRitCnp+BZz82vAFwPKJ4ZiC7smwkC9fy6RIY\nKaINWbr2+KwKKWsTjbePHfbHEMPnAWRuN4GQAvxzu1daoWEI0L3Sh6V8dweC\nIKOnHstH0qhb08ZH3jpdaJpZql79k3WASTr+MlO50090OACOtv6NKjUeCbcb\nqh6C3zBbi+GjAY0398KbyvRdCpiuR0OxsnxaD3C0n4J0yC4F6f4Wh3MM1p2X\nGJa3zUylnnA/DkzvF3T9OLJFt9U7cFnFDMWQ8W+9OGa95T/xP2oMv9do/13x\nuwQrbRu5HkJBAodPbxTFBTY6Vim68mdt9amJzH8/TO2r3IXm+UV+7EehbSRx\nfJR2hLxMkNml4fWZ8h4Z7GXMRUW0PTKaWiehcOKyuTlrwEBMpt3Ug4bDJOl9\nRMvwe8WpGZsKLRqcU7ukLjtQCDgBT3246VVqPNTneHr2cdU8vPnm0EQ1Z/yj\nhzMcTZTjbOEggYbaChYjGwB8hJfg0TKlr+13DqBW2fAuI6mvt3L3tcAzC6FX\nLBLLHBgTBTAkdCQgnAVsdLBY66XwHpfcuhWQ2zaicvaQK6gz1ezXL1LGOdBn\njZB99bVvlRC1emJGQ+5wsdkBeLBNv1HNwfSf9hie86VJtmKyCtSaG0UMKE7o\nbwAe\r\n=pdOF\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"59eec95a59056f8a05b6595c8e0364ed1c134302","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.7.0-beta.3_1604929819599_0.15288384541180977","host":"s3://npm-registry-packages"}},"1.7.0":{"name":"@apollosproject/ui-onboarding","version":"1.7.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.7.0","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a1df5d1f8d7c14774acaa696302da930c2ff6d0f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.7.0.tgz","fileCount":71,"integrity":"sha512-goqCm57p2Ge4A85Ja3TMDPZSS6jf8aZtkgYe38+qdh4q8vkYvWx+3i+5EN5ZXPld8XgdmRjD4SOtkmZ5zGoc5Q==","signatures":[{"sig":"MEUCIF/WPC8rA92bBcdiBJkyTyQHlppvnwCLQK1a+n/x40eLAiEA5PhEzplM2UAmH3CMsawb5HIbvKA7fN7DiuaOGhV/D1g=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":559541,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJftXpYCRA9TVsSAnZWagAA3uUP/3f0GCghlZQ6gOJWOgYy\nehASyolAbxpDQBlBVxFbt1OhU0Vax1j2bPzyR2CyHodSuSGf+irzaJez9KNS\njyEasm9Pofup3zbNlk8v2YRQW6xJdqpgiYf4J7l7syUruVU4wccinauNp+DN\nEVvg615e8veoqavQ1UniVqLI/gmDxAFqL4MaWf9emXMPT8NyTcn5tsmceLLu\n9rPDmXcn7o9Afpb+/u/At6/I9y3NTkxuiA9vxG3pb2NT09ZOZGE04t+MDomy\nIl2DHHViLRjYRL02ezhcElec8Fr2O5kM9W8ZYcTrF5YTEVVZYX/0BYLwSmK1\n5TbiuJiFOCDuyhprtXRjmUA12hgqnknAFe7XCCAXI38IJZ6HzvbPI9p6QzLJ\ncXvTok5ScbDNF7AquaCHkrIIcCIJg5AeLItqFZhj/nRo1OmI+rbWslgL187h\nRCZ3iC1yM/w6MutbSt8sTBAwVbYuzdypaoc89jmxG13Fo4wCkDsgd6/qiwNl\nqbn1ZNrM5iwxFxUj7mX3iHjM7EYTb08gaXF/x/XQEpyNoJi83NM8PuS10ii6\n7MoPuCDHmVxn7wvzo8MBNhSzfu6gJIKE6fS9owgvqeBehOuvQo9clTn0c2S/\nnkSrAFg07MMDzmUPN8JSpvLTz1x2GEvm+Zp5ayERBo/B5E0qKtlHoDhjbt4o\nbBGj\r\n=2wIs\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"24048b50f87b3885da72032dfba510fe53c1841e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v15.2.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"15.2.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.7.0_1605728855798_0.5843169678818285","host":"s3://npm-registry-packages"}},"2.0.0-alpha.4":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.4","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b9ccdb274b2238b879f974aac7b19a1454353624","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.4.tgz","fileCount":71,"integrity":"sha512-RXluHTbMSJoFsppzmG7XAu57VbqpjDVx8vz4IZ7ULxfK4eHlJEVPQ8lMGlwSkCnumY6HXtBHAISDrtJeHDC1kg==","signatures":[{"sig":"MEQCIGXg/tgEB71mdEAqGrxh+wPXvCp62FUJ+IjBn9S2fl2HAiBKfCJT+yjGqBtmhqyMl1ZhFKVFEa7Q3ldqgxmPqLUGsw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":543325,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfu+9zCRA9TVsSAnZWagAAnrUP/0yUoq/7Om3A4vzlzowD\npthzOUR/UPWiacGKG8z3aOfzreGSrn+1KgSD0iFNO+xRGX2kvtoqtdiECVAN\n0Og153qPHjcJpGTsyclwdjimBZZb23ejvk0Qefa81AY1chJewsR4409unkJf\n8DwpGoNpD+weq8EoIpfPr/57sCPb/knH+UtQJjAqNNrwPXca9pSorc+dwn8a\nc/QEn2jPX04SmKezoDUq/I2KcKLo2YTEVXnJXx6Bxl6nVNidGKi/EtE4l/ot\no37h0KkbB3XfGpEnh8zxnPG38gQHD/oF1QyDRvtbQQkqM2EAv4ABMh9V4Xcq\nUHYbxIT3tpFCl/rLAoVaIBdhAicCZ4evRE1vPVOx/bnGtGicEHbrLjEpDrJC\nHXFUFD4MD9GzpZolMqh3KOqv13dxubeMp/74AW8d6MrQMznwsGB+iMt3TPe0\nTe1W57VNOv2L0dXnqV7r762YVGvqfF507lhonZUcKnMp2MayCNADljenG45X\nJsiWqYyoUoshhe42/baxn4FMfYibzQU8PQZHNm5SER+B1cPONHW1ouzKDeoR\nRZhCds8MMCgz+/SxZl6L5Zbf7tvjL3S7bZuCPjCfM3r3BFWDkhjwbDiqiBQD\nvt2ZjX5RwaJZdT8zOSk3tpXRJTEKj92Km/C1KwqOeaRuUf4suSCuZ9JcVTDv\nfHFC\r\n=GGrj\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|@react-navigation/native|@@react-navigation/native|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"754f09de69a5bbcf70ff5da79b95084d777f1873","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.4_1606152051126_0.4627438324838218","host":"s3://npm-registry-packages"}},"2.0.0-alpha.5":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.5","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"57201dcda5f4d5fb67d0cfc0cfb72c531dbd7247","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.5.tgz","fileCount":70,"integrity":"sha512-aU6e1gwMgCj7jmjwjU62nON7HxJWqvTtqPjOmr3/FtqkXl2Syp9sJkQ/gacXSG1l4HxXn5lcfcqbPIwS07D8bQ==","signatures":[{"sig":"MEUCIDE66uMrqxBUTbeb90aDQCGm86i+iebEPsjN3SDCbb4iAiEAiFBxWVBknt4bxB49uF1eSH1EIGhqvN5BEe2txUV8Mmo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":541495,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfvA5cCRA9TVsSAnZWagAABcsQAJOD+M4++NO/OX0foTuN\nLNBH31Mwnc2IgClS5op6cbZ7+hRGuSTMn8f8VavtJk2kvil7loyzlSiZPm63\nX7JiOXpayO61GNds1yNraV/g4l3F6k5CnCThxK5obpVKni8XxSGhQode6FTu\nI1v+IwScnxyOiJvkoWn+pnrBvdEa8dOvUr4sQDqvb7ToiIDjyDamWb1vzYSx\nc4HnXKqVUoN734VovtwV5+FLHT867ySPuQcvZaBNrvMkZYUiOgeIboM21W/r\ny+yPjoDJnExd6jO02OaFvGfxzZ+mHm1I6JG1S6mgnw06XCMpZlwAxeMd1S1b\nfxEErVm3xsPDjjwqFSxNNXjtQT7sCtKrVssu/sTYxPuh2tbxGSHk0Y6GB/4L\nODBGWEbnK220O3laTSZTlSTFt4OKgFFuaSl/E6kmDlMgwayrKkSkWd0iwR+0\nHNuhYOc21dJjbhqGm6OujW73rm2iFqQdHuLfNzDBajJO5arQ7CU2Yobt4yxz\nMTGb3fVrQGXrcEZw4YrIxsH7adFIqe9nUeIYO9dm60SfyXGxinHFLu+QuZ5I\nTAQvOFd3EiTMFABuSNLEyJojelS59kZhksf4lEPldV3UeKCve+5ywpX1Xs2i\nS02eiH03CEENuCKOQO/AazEjJVZYQKIfpqYMkqVfT4RcVqERue8tma/2E12m\nLYAx\r\n=GdL3\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"151217215ba71cd4e4dc1a9e3b266d22a64608fd","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.9.0","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.60.5","@apollo/client":"3.2.7","jest-react-native":"18.0.0","react-test-renderer":"16.9.0","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.5_1606159964213_0.6116115788800098","host":"s3://npm-registry-packages"}},"2.0.0-alpha.6":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.6","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.6","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"0a2fd34d76d8860e99781a61e787c5c3f49af929","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.6.tgz","fileCount":70,"integrity":"sha512-vVbQg0iI3oOjoopL+Q0QBjTBtcnx5sdIiJEbkI7ygUwfSzV8mbRdkBiw8Qv3WmBHCVLUxuRKFhqTCuNUxYlobw==","signatures":[{"sig":"MEQCIDN3boOs5j/JdlbsLulXjpSzVLg/OugpG+dJU/YHfD/uAiAcZO2VCmhYoAAEdyYvyAM4SSxHbWe3BaHCXgcztBNSog==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540267,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfvoGACRA9TVsSAnZWagAALT4P+QH5LxkWpk3cteanyQqr\nAdopfAbnEnTzlGP/O5C3E/+Ky2TJ4Q2rx3+GJ+l/0wo1sawXKyukOttfrWto\nM73owD+dLr7JH/NjQ1GfaKKMKjFlI0XQ0zcAVS3UaQ/ranMmkqFzwhC4hKoh\nvVjIhJHFguIDi569+rhrJQ5nG/iF2ntUHlCaSonIsUlI5xaI8Et3Z9QzTocU\nGh9AUDCsai5S2Esby2IesReEhvbS+HXIhA+YaNo00DU2PgINK2pNuocscwye\n5jVIbwTEH7kUKkMwyWtyempEZPUVjKVm8c8N7K9buXvzWsrGKO4xildW6MUx\ngwpUD1ggXO28Z+xCcvXsKtVbOCNwGKkI0nXw9nJoTiCTtpU4i1UOU8Tp5CzB\njO4GbZ6hhx7Xif9Qbug5zqfS3myGTRuXZ226jrLalbg+shM/+9MzYk6ikbLX\nIi0EEyUQNSVqj3gdmd5mwQUto+IKoWR0cVaLJE+75eWbJNIj3nvz4epW4sFt\nPwJQ++rA9SGcMu/2gsHrzOYOXEAeRMd6IBHAskuledASooRmN1xF8pEHq9RX\n7lDcinMjq9urUoT4mL56AhYLP/DqL6qAFLhQJOxxA/6RGY4goDmo0+glwnT0\nCw/mT1Y8QEdCHbT6uBA3mWchI6KXLOiGAUJ2ssgE3xhAgh22w+ubOPmwe19S\nKj7i\r\n=IMjz\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"e2230b144e1afdf856c5316339a89fc59ce149db","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.6_1606320512486_0.821457236892112","host":"s3://npm-registry-packages"}},"2.0.0-alpha.7":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.7","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"44c804a22f55ffa9875512e44ee7e83aa16ec230","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.7.tgz","fileCount":70,"integrity":"sha512-Ox/W1dAl06BERg3i4O4ZMgnUJ4R9vVraOKPI52shgMWOds8i4B9RoLMh0LtzmQLROIqEZJcMZiujIvFVWKpKtQ==","signatures":[{"sig":"MEUCIF6Q4DkHj55HF8U4qO7wqcG12lbff1iuNSBNI/XkUB86AiEAiDtJhEdLZ3a6PjQKlI/+3xrlzcdHLT5+8tkBG75yemQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540267,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfvrLhCRA9TVsSAnZWagAAYXYP/3f/lA23gwwxHsic5PaL\nTzo1Alfqdw278A29iFzvOUSsoBihzMGr01nVZr1/++sS963XJRaf/nr1u2wp\nQuioXpk95Bsv8gTntlQwrmE5XDjgE5KMcyjg94SG0mdOCTEVprKx1KDxFUX3\ndITxNYYGkSZ95oAwimuFbccVJ6Msp5cB526S6H36MmvKEfM0foVMLo36SFOB\nqjjczvTOeHgheS1sEJ0vsOVkRux8uYhD0+PloSewMi6lzfFirSMXIuRCOPKd\nCHQFJnUuSlPtrKHAJ6GL6vNGBVaHEthgeh+3C03dd+c+BKvEe+EghC3kTN1v\ngBl33b51W6UEnp4Lz3+D5wiigk5zR1N3iqV86kGajtbjsC8+Gt3zSJ0sLBNZ\nN/Ppxnxir24OBX2RJn3EOztN7cd7Hg0qI4V+cL+3Yuvw7bgwVqJFyow4wYqP\nRAI11S3xbN7CnOquZe3VcqRA0XyP2ZI87y2X0ljB50+Acj0twXG85HT+04sm\n2+rY6Si2Yfwg7p/Nf49RWI8KCuDRY47103qhIzx5ZwqHrA+FrqrSt2MlxjMw\n0vZRPrOYwBP1QpTeUsVgx5Z508Sav/jXruHEbGGgZbKmCHfmUndXVgWTmwDU\nGxJnXfAgzahDfGtxZQM26rEUUmIoBK09m32gbOfTvjp3qQSiWC4AZJ0sM25v\ndJET\r\n=mZyI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"d1769264b9b855618e57fa0e758a186ee301c6c8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.7_1606333152931_0.41657722432124245","host":"s3://npm-registry-packages"}},"2.0.0-alpha.8":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.8","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.8","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"298b6ee0d77876c4d5bffcdc3bee3cf9d32d1835","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.8.tgz","fileCount":70,"integrity":"sha512-l6+gQqkcjSVgwdOVJ/UIBe+VmdvD/enrZjaTdHdtuYXcctPYew4o0XPM9sbgioAbdKG4+H72ALeJCij8ol9mgw==","signatures":[{"sig":"MEYCIQDgNdQVjZEIiTZZwiRygKXYeRdUrVNzCu5Ra3XbWK7bHAIhAOCQQmN2RG0j4/8wUD8nOlcgsw6EE62ngCWKAeel8W4Z","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540288,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfvrMbCRA9TVsSAnZWagAAXH4P/0if9CSxIdUrMhyKaokD\n2pBjINi1e7Sr+vVVOXf4lLSNhpT1GOa1VOUAqqsz7PlGdsoWasGqxBRsr+B1\npf5E4XLofNjCCFHN5+tzjn9cRZvLgDWdKLtX+7jfrs1QQ6wgPd9Y2wVMJsl4\nMNnuvcMRbE0NL8DUXVE4SYf4652NkLIJdnReZN2GbQxlpY4jT6Zdji2ucy1v\nAiJ9ZbFZKen/kFXTJ6tMy/l5xuZ0od4pI8rARLBFAbL2xAREdo3pzmgYYik4\n+3VYwtidHC1O7c5hZ+hwPe8AthraFeDJU4e9+6eGrHU6Qq97NK2NusjyBQS3\ndg4qT/Dur8GX3ovp5+u1tDtFyKWzaRxIHNVLizxarxLWmxFEAQtpgE0ouVnF\n+Z9ns6zY+/p3HP1W4gKEbe6SDb1m+lqii6E+AeqQXdh3hNPQ/tyme+ADi9J6\nHLYXVFtX2xJ7Vuw8VlYZ+TXyzzt+1JUzsSSAURjQeIDt4HJo7/pUw0zrCXdb\nDgtO51KHRG/NyR8mudbG1VZ/Vo+HSd9EmoHf6d3Xf62ReQ9n8GgbwDJA0Su2\nTnKlN7Bhj3DNOZHxgm9SMn7HGF1e5/b0QfOrkxJMpzvm/6e7TVNxXgLUy/gV\nNRam7s2zTpSHifH7nPBUCk5ruy9ynX/Bs+YXnS5DyCPTucebFMVby7F9hlTU\nIBn8\r\n=V05a\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"fc8cf3d31135550be0a60a9aa54e4fc1f799131c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.8_1606333211347_0.36476637138605184","host":"s3://npm-registry-packages"}},"2.0.0-alpha.9":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.9","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.9","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"24524a43653cef2754ee1b4e806fd8475522a35a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.9.tgz","fileCount":70,"integrity":"sha512-BBiE2NpjO2GLexmAMnmSkYfBETSS/fIhCgEOQToBzqBG51gHAAKPQ67yI451QA8+dbkf8jUreYGBzaMNNpRcRA==","signatures":[{"sig":"MEUCIB0FXkUl5FXJ/TGSUNgETqPECz8Ye4T8wW5bVe01JNpeAiEAiUsZxpfavUbYGPanHznVvfmu/oA2q0q7DUKuzrQ5Lnw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540288,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfxUJrCRA9TVsSAnZWagAAvggP/RsbkuxU3vDNJ2/YRtgY\nwLpuIo3IAX/X4Eo2w1yIsz/dkMr4SFv3RocavCT210CejJ9ZUEhDMAMP5Y2C\nfFVBgXefzfhIa+QwB9Uuo80RcaGtLf8ZtqF8yBSkeI6X2EzUCa0fLh1CU7Vz\n8jtObQ6QUoceRH1MR59Qo/pwixXru/O3ELGw8l2SW02EgZwncRr5RfumO0Jh\nQax7YzGC7ZY1xWZHzaZ6DafLmCRYLMeErZHbrnP2IrfgJGMSnYHZu6+bUBtF\n3bTg4uRd20rkGZMnLBVh+jN0GePdM/POIFiDBvNxpPyqydapW8ecv7Eq7V6i\nmmQuOhZobDpDPAa/N6xUmPrhuSxAeuUhkXwDg2ZCz1jkvc68Mikf0/1IgDSa\nzEnXfxu0AqSlYqBY9EgTpRZi05Oz9Mz1p2ODjD4zoymzsNModjmsdKzwtsHp\nkelsQ0Ryz3AC029sPhjuCQV6xadWoQYZdyC6wKvfw83HUdTyuB2R9kuZ9kDs\nmM70mlQychn4l6FE45qneFPnaBhAtxoXSGd/lP7S8/4aAma9g1aL0KnLmuwd\nvdzwvtFR+MWiYYvyq1xA96nUJ4FVaV+PPXPujEbjrh5hNKUsq6hrPCG36yyC\nA0nW7phRFRuqVHwDTMIcN4cPZ4iQwVxkKxTMCF6ZKsmF1imIu9/Z/6qu+WX9\nyQmw\r\n=j6Uf\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"59aaa97010164e06f39abac2e86129b6749bbee9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.9_1606763115137_0.024913595788158105","host":"s3://npm-registry-packages"}},"2.0.0-alpha.10":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.10","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.10","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"15bcb1037ba430eecd73d5cf138540e1ffa5b645","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.10.tgz","fileCount":70,"integrity":"sha512-G07+RF0pLGdQLLKOmuMohJ+YBzoRNABHYEbIe3j8zPE2ufcorFEF6hbouEVLnv+nmbphiO1AGRQevqL/nyH8+w==","signatures":[{"sig":"MEUCIQCqUWYEs/6nqTMj04jZ9rQru0gSqeih29qcSO03qvnNRwIga31UCUsS4nSBHtRxFLafIpfaH+nhh5bapxpaBwNbQbQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540289,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfxVSdCRA9TVsSAnZWagAA6YUQAKBgkYVQK2L81n4rxkXZ\nWdZwrvTf9qOYzILXHT0+7S2ohWqyiEL4XeTqPj3aC9uxl1axGAVA2n+TizgP\n+XJEE+o3T8iQd50GqU8h1myGSBByAj0DVGBWC4Ft9YoX5VZpxRHG7ZRIfM3v\ny7HNoXFoleyR1nnBd1WTc1tclxrWMxqyL1HM8WVxrhnkOyjG3tIgY2dxMSQo\nlyCGqosz8GfrIC5Z76Q80eex/SOOjuDYxMyKY3PYqsAKEF8G60k/i6bWnEQZ\nuDHTtb1SXwLo7WoM2sCTtWqXx/ethaX2z5JaZJ0nmdVx6VpccDoZWGt61oyj\nXP737QND7Fzk4vG3Q+2pdH/Y7khWJM0noo/1r7fXX4CIXkOW3YyVx0G3RXbO\nnfGAQ3Y4Ze2YdF7jBDLh0l+kh71Wmr8wIr7/x7SKBOKp3VcdD+rB4QKi7QOS\nsB7hFOEoN0uvkfrmxEQ2GIYbqomMQQnMiazcAbAzhZTHhblcgptgyXIDIuZa\nriDzYA3mov07PfQfac2yp0rWPhW8zf3/ro9JirBXo51z1wbSlBoaxPZCYtkZ\nZW8LiVnb71RRRoNruqjtXABsC7N4kIckz/Ic6I3/GRlbGZHLSc1Y6/zSDmWX\n/BtPqQjF5wlFAqTQ5vjTibvpVUjVMsHSaz9xmiAAFrpKegszRBdeaQnK5ODa\npzZB\r\n=dvJY\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"5da6f1620e8116fa937326835df11a8eadb914df","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.10_1606767772945_0.5888510298803844","host":"s3://npm-registry-packages"}},"2.0.0-alpha.11":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.11","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.11","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6582e868da059158a7f84ff797205739e99007bf","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.11.tgz","fileCount":70,"integrity":"sha512-YwCrlvyvNzOJFnHOnOdRYHHngHfU64FvRoirGybSauoHZI2XGcS7/Gy75U3RYqL3YLmmUHWNxqB7XxknJ4JjbA==","signatures":[{"sig":"MEUCIQCSkzu67OnS1lKidIzvVLlvy7L3G5kiul5PHxqRyRbCLQIgFX/l+UMNIhXJr58zLizYGZEAOcGwrpMmjqmvgGbBLeU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540289,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfz5tlCRA9TVsSAnZWagAA1jAP/2utHAwuRh3oC44A4ebG\nf0jW65zji9ToyCesmINusUqJCGOonyZwjVB3YZnKe10FmHVOk6zqQ3yBCf7u\nVkQmrHP33HIrpPh/brnaO/+JIeafpCJ8heJJo9em+wXV8fnk1jY1jTD3MkrE\n86UOls272vyBZ5sbwHKnnna1n+vIGwzEynwWiXLt12YfxC7pqNvYnL2fyJiZ\nJ26Rx9PZydqp4G1915TcBYBYlj/ouN1+lucQgy1smmHzo6YID4+epCpFUQ6W\ny+C9D5kzfZC4EOK7fb8viHbyTJoANXlSLxEWID7/Hsd4Q/4tnJQ8AvvIl99w\nqmVYUs95gEdhB1fzQq0O+XPPTNOIbFEmY7SFvK2j1q8SUkMAomssmdn+cygK\nBkoL8w8t1xT37QqCEgMF73tacC2LAI6VGlaPwIKfwcIPzgEpTx211xTKmNJ8\nkzEsqPF55hwC+sk23sC+Ihd7WcEdBd3BIwHZkTJ5PYkCjIgwiPgmjp680hfB\nR4nAFQzHQig2ko2YJiOTCBRNp+0uNwa+zPl2tB/zjGFbGR1hYSkdTLC3Z4Rb\nMh9eel8Y2fTH4e9wBg/aCc1OzkHyGttMt47Vm3/PaaGyq/LXAJS/CXYFAV71\nOkwXgfP3zVYOUYWwc0n5grmuLaYasONZV4tA6t1ti259BQ9TVpj1GaKKzKkK\nw69M\r\n=1ng+\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"84203963737ad269c997fcb05529d23cd1d9ee4a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.11_1607441253165_0.5045756514560586","host":"s3://npm-registry-packages"}},"2.0.0-alpha.12":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.12","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.12","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b3908228a7a76a34ab8cfb29913ce937f14339e4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.12.tgz","fileCount":70,"integrity":"sha512-QNDZijwD0KlsNTRkRhdQ038P5VrlN4v1QKczznK6gCeS/pG9vYRAB2K58I8o3rJxeeZswR+GfTUEoMe5tCbU3A==","signatures":[{"sig":"MEUCIQCZFWmJ0qRZ6jSMVzwtHkD0e9zc7hF5i8GgJnuG38F/zgIgUh3bBZuI5ffYyMzh7DJ8UVoR/+a9lwsO53ViEW6y9Y0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540289,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf0NT/CRA9TVsSAnZWagAAXtEP/0jHg0NZRsC0TI0ahepT\nGFpDihGfgIe2qyQLgiDAZnmxjUxx6tYj9vjDUk5+5QKegv0RAb5XGV6VhL/j\ncujXlYpzKN8cGsiBbBO9/pxV8ZLeBDi6ZmODJBJdE7rZOLqKa4YVoYrXoc14\n72FAkb6h4OBWHJN6i9RYOP98Ofvlf9hyIW5z/WwmAG15TyEuLhnJzKJD6w8B\npqiJuaZaRQTeCtmOyK3q57JBJ0RYOa48nxR/2dOYtopDtbQQng6gMXJSixit\nyXXwQ8Vb5czhn4qnHQn0OwLaKZlaUyBO9PPinFlPA4BJDPMsA+bw3VvbIBfy\nZEIAkLizbV5fvE3GF4yxTHecartLi1EbAjcnlCbiOtZOatWqBXHPAmn6szZ3\nCQkFMpxJOHdKWrO/6wgbdVe6hs4ljZ9qLnXDeS1M9Lf/01BFaGlpULdslk4J\nX8GO6fpqQJVxLOKi+1bH+m3Pq6j/COU86Xge5aZt3acsBMrnH3FE6zIyDh+k\nfYqT5sxOYedkv+7YaszNBx/xbqFmJ6/8Hm1c4s65jWriPtG9VZi5JgVRp+V0\nAj6TqhbQ78RJkFfYmU8tVNN4R5ysbc1LFgTs4IgwBnmcYRS5Ii1oBsspHhsu\nHhV9ipkACmj2eXCc0H8Pdj3xGeuD78wagFhF0Rs84kmce/C4Ao/xXiGWImu1\n4ZHf\r\n=t9Oa\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"743430b22e30b6d3307fa76fa35d991a7ccd45aa","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.12_1607521535446_0.26975060569091136","host":"s3://npm-registry-packages"}},"2.0.0-alpha.13":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.13","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.13","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b3c7e90410e94c58c609ceebf87cc9a6176dd442","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.13.tgz","fileCount":70,"integrity":"sha512-/LcYtnfM7M0nwhzjLI2zdv/qXTxeLLbUACsi6AVB86FEOxvgdPYg/S0rAtJeSIS4JBw302h6qlSnhhTIlMc18g==","signatures":[{"sig":"MEYCIQDEDFclTUHxCTUftXjaPnPYynGq3YEq2uO65e2hb1ZCYQIhAMV/UUhjquxdC1ZNIp7HvVrP0gm57i3id+Earlx8rXn8","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540289,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf04UOCRA9TVsSAnZWagAAQ8kP/2yOAHwuEkhZUUlLHYnY\n5lXi3rz1PCGBv+8MrOUASyZBPXqqyOq8xHlBCVK+IacL8nHNhyCLLT5Yp0EQ\nfz/Q7mG+/FMblyzeFr3oIWoqkWvGvSJTEZCP3nr5Q7ARb7sVLphDWhu5hhzw\ndnaZ+4LR158o9CzNj7fWSkt15qoBxj5IHWJ54kiky5e/gLmV6cjNo5HEQQdX\nSCNxs2szckIilsQTomPT++l2bBwt4tRaoaNMGyfE40j8XpJMluTb5SsE9iy/\nlYLfCBi0AIfS4ANiVZp91vNx5xsx61v4/jnMYpbmZ4xmmXhSuzarrManhbNl\nsMhZ2/nEuAMqDHmlueaJ4q0GfRvYYDLEUYsAkESTTinPjxal3ivssWobMJ0R\nNC761elKTni0lqoADQb6f8be6JmERl15W3kIB4vQSc9IvDIf3HZZ4tbJbK73\nfrNlOdm+o8hnhMlayzLO9Y04vbNCo/K2en2gdcfIUPokaQooIZL29t0IE1I6\nkhVHB4YCL3HUhFrVl6SOps6HTv0eoB7+gONaZvsldcnOOuUxaxHeUGWC0Sfr\nvOzXK1kQkmgwxwyj8L3ut7Cv2XIn2D2CJQZY0sn0cU3MPCvaU2EHnXO3/D37\nOwEm17eIdEDadFnNFFcUds7IHG178ZZptYsshXPSPIePzUilowjo4yO9ayJN\nJ9zb\r\n=F3wH\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"076102184031c46757e231008f847f1725b80953","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.13_1607697677549_0.24171080959440028","host":"s3://npm-registry-packages"}},"2.0.0-alpha.14":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.14","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.14","maintainers":[{"name":"didevshop","email":"hello@differential.com"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"yungvincenzo","email":"vince@classyh.at"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"52d75d8c40651d88acb633ab0d3e711d8ed7a746","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.14.tgz","fileCount":70,"integrity":"sha512-qOO2QVnmkAFHyI/Ao9Zar07H41LeihXbkh890XsmOE99sXcIy1DgTGBlS/zgdeVob1tg/A7LPCkjEexmTzdkuw==","signatures":[{"sig":"MEYCIQDr5SrC45kFOr/XN4EpxRoKHwArg2Ii400Q5qK8+QlclQIhAIfwNNGcS/cV20g9OSWwDklUyR5/JJ0N6ThgqYKU20Hj","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540289,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf09yDCRA9TVsSAnZWagAAZlcP/34obF2LaDl5h/ICgWQT\nPxFv5cdavWWY4PXniI6hVJdDshC93/XE4DLMUxwvc7dNKdKZYppkYeoupEs+\nrmJENrerj6zKH+l7PUH+7ByJffgiaioSn/WrJJeWDtNQIN7Jmcb+DWTX3DEU\n1UmhURaVCltWvwXP/4tn/o1Gatx+0Ba87OUmGTETikpHcUejMupjOQdPs1XS\nTB4hRqpP+Ryg7gznjUx3d6ab0xd6vg2Lvndx17DXtQ3J702kVu6XE2aC+q/W\nNZCP1qv9pPKjsGAC5YzQUpOr14uPKg8mhNJYMevL5mRhRtgdWC/WKdFbTONo\n7C7Hpa+GnRaoh5mnk7CHKN3rcfEjpecfLCEScZZd7J6BEhkwbJfq2RrcWqp7\nO9oUZZbJeAD7iekLCkFN2oZXBR0ar/sjCWbIcDqteKwHPxBaW6dCDiMZjcyu\nTSy4XCmTzF/6CJUOCAuAlxTLN1KCJzW66P42ziASYSeVld+GR2qfDt1OAB5I\nWYFWyySh0zl0WLEeBWieLUo3lP7P/g7fVbSNMSrZ3rRNCvGfNLxc117kAHVG\n3VjLFFYRifC3ivZMBVFAPHdk2ym/JaYJQF68tUJyepQ/jVH+k6NGtSR7gQUo\ntmZ5W/6qNWZzBXeFMdWFikUD0J5wt0BkS48rXXOpyxjtvuL1swSOT/kHWxbG\np8B6\r\n=9hKU\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"418068ad8f3afe545d1f43684791d53e99d90951","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.14_1607720067113_0.8419244842456632","host":"s3://npm-registry-packages"}},"2.0.0-alpha.15":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.15","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.15","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2823a6bbbb07814b75423836b8b50fadb384f131","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.15.tgz","fileCount":70,"integrity":"sha512-ceUClFA7qUXyGKGkRgRzLR73Ze55OTaD4e4W1lLGZbUchLSL6eILEfrq1UNtSzewW4lnqdV+/Q/4C9/YPO2EvQ==","signatures":[{"sig":"MEUCIFjtxevyHPfcdg6SLZiap4EvhdKLItDCZBIqQ6WEMDCtAiEAiS1DCPyMlqazgCo/ZHbR14hTjb1nTA7SPez5tASIytc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540289,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf15i0CRA9TVsSAnZWagAAjQkQAITM3AtKUgogpT51DXEa\nxHS0AhHffD37EkAHRrAwYQcehVfR3KFl6tnHgmtEJf5bbz2s3m45k4jTUrza\nmZjCrbUAqbclJfWXPSTu1PeFuS1z/cvXJ+39UYLspD28HMyltHCLOeuoyQ3K\nTxi4k3UGPhJr52/UIfWqdxz49TbKR2Yhp5CaUMYZWgPlkstptBu3NVsGnY2Q\n8uGC2wzjWGQJYnioEdyqbrqsOjcVyBHq1Cvld5ykJsNzY9ypLd0AN7F6EMjA\n5y/y41bWeSBQwPyGRpmZyDf+vtFihKnjB0IMt3Ap66NUnigpNpELvfyCVHdR\nlC0/I+rqAYcVmtN1akGzK7n0T8UeY8GbYn2A/NTfd59sJZqfv4oIo3VTjnkk\nxRCf/Rcp6hGOx9l3gM0Pj8fUmT5JbHgcPfu6lKAqFRvlmosOQ4ICO3DBxs0K\naWMc/uvrORf0Fylw9QwNzoVByhXGLyTQgjRW/rILQDop5J5bvi0OMXLwA6KG\n452YXagsmI5X+l09tQDz1g9M+khx5bd0HgqtzxDgUwLbSxTC1hlIXuco3u7m\nI1WufwyaJsBJrx4p04BYEYEeN/TN4IJ8P/fMVi24kRe+F3VwDFTpPkzWslIk\nz9xc8UXqrFZiQuqfNlXPjNu25iNc5YDC/vUIlZLrCyUmiBTKSJE7CXDvQgOa\nceqW\r\n=i8Ph\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"9ef8d244cce77f8e843d7022ea39cfb279df66ab","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","react-native-geolocation-service":"^3.0.0","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.15_1607964851857_0.8125253411917932","host":"s3://npm-registry-packages"}},"1.7.1-alpha.9":{"name":"@apollosproject/ui-onboarding","version":"1.7.1-alpha.9","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.7.1-alpha.9","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"05efc283adb49799fe946d6ce7cafeac3908fa84","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.7.1-alpha.9.tgz","fileCount":69,"integrity":"sha512-ombBsrg1i/tNykrJttWdcF6BxZj5jw3KmxLz6OE7gabvyWEaDUsNxaTp2Uzq+pS9H5i4X5KjUyw8mdjxc1B7wQ==","signatures":[{"sig":"MEYCIQCc99EjD8LJRrpFrdJgqOyuXrKNZ3KxyWL6azPfpCIGCQIhAJ4Dt7E9GaY9gxWPH59Wt3pQFm4zX09+k0DGV2TrrlyF","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":558571,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf23RhCRA9TVsSAnZWagAAQN0P/RYFi9vGkeeqqHnLsxQt\nHOrzlGH2GhhC5P5jbqGzqHp16KmOykyRVhMm7n45ThuvucOvusnixbBxXm9m\nt7PfT9kSblQLea1oKFgaY7fk6Z4Vz6/qVg4UVt8KpBMAXq6bCbGE5NacjeJg\n7nEphvJ0bgq4P0w/5tJoP7TqwRySED/updnPQNYZDzEMsbLJvqV+7UnI5yBy\ng7TV+M+Hf22ReOWSbfA9heKssoOBUuGKxZdvZ9xjYIBENWsROUtzKhUPDoXw\nyEE3uT75mQqAFyHg2Bi3Ma5pKJUoTDCyyqFnEy0wXVSnugZQwUOZwfM2fviR\nYcbd4REpT2NHCr04cjioFPbDmTk2XLxeE+j3ZIKE+P/2J+yANqfzNvZVFUjU\nhOhMo7tgpA3Nz+4MOWOyYRlWxgQP7/yJX8r+npiSIDzgVi47hZM9cQl/mpZD\nVgaskqhm86bYuR3lWJOWlX3WFtZd2fZcV9yl3097WvFPVjRMJ+HSwLbT+Trc\nmfIJrgH2VePwCVzbeiK1XLP9qo5HsbLsaGA6/PpeABcxWUng49l4Edl0m64V\nevC/8+C52404UZpxUzocY+e9mvmnB3qAhisXjlele1GRWEGde9JUyvVa0sNU\nEkTYiVsP0rN8CZqeNAInCI/D1X74wD2iRVTwxlAEz89WWm3Y1ge7HrilBG9k\njWEy\r\n=rfyi\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"c0ce7e55eb050559cdd5b872a86528a9a5495cc1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.7.1-alpha.9_1608217697286_0.8556388737237459","host":"s3://npm-registry-packages"}},"1.8.0-beta.0":{"name":"@apollosproject/ui-onboarding","version":"1.8.0-beta.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.8.0-beta.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"cba185a5811daed98240e16a007f4ce0ef0117f7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.8.0-beta.0.tgz","fileCount":69,"integrity":"sha512-NMEkYMRRecFGTF0CwDUdkwzja+NXss4uBXWB10nY/T/JgQawF5shBwkccRhrOI1UnljjQTwye69bYZZqCg0ksg==","signatures":[{"sig":"MEQCIDmmOUyI1jwTanNmmrVIMZwiQBm9eBfjMbcSXulHHkhXAiAqVDaD1GMh6SO2w6P5gWZ3M3Hc7DIFW3Dx3N/j55VpDQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":558890,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf9e+2CRA9TVsSAnZWagAAwP4P/1P7U0styIPvXXldpjVX\nvhsr5gyBYyAUYWuuIU5vdbZQctHH3RizqVUokFwTPvjCGu9Pf/3gb4AwfpL9\npXD/qRI8caERo3oN507ZGRgRDgWlVDaQbIellFqkgqtK7/mMFTO3V0d9snxG\n1udiCfT2AS6aWiJ7Ea3+fIp5W9Upp0SXPwNgaY45uar6RYN6Zi2jEMEh7N4+\nFcMYz7CLSTROaxYJuX62zRWiBLeswftJiunlLG5Pdi0fY19DSSnNNoZTuuef\nqzdM3xYwJ+ch/kz/f5Qa2lhe/KR5vrMD872CME15s/8/0PoAJTL1SFyQd/1b\nUVlORKerOeBAfJpk87fXHbv5s53UFPXQJ3JxAuDCkEBgMKXIoUJMy0F+s2ne\ngiMXprT94nNJNY/INHtnFNFTNwE2GPGvu7ccwvMxx2Q5jCyEiN6tGmtRG6V1\nGfLEpmDywZWGBHknPZWueSNj93V6EFb5+njcYRoXqN/5I1x6XWZEmR4u7Si9\nzwE6WkgBAxSwOgOfTvb5jDdFxx5HMClgGG2rGcgrel5ehlLJMDifH1x2TPd7\n7tSGV4BdLEeK7Z2J8oHbLkurAtX3rLP4xp1TNpsBaZ+aZln08iN+wekV5qSH\nYo759XokOmq95QpfgZcp4l0NOga0ET5j6WHEn2jwQHGqHfjfvkrWRuN76jTL\nVwFQ\r\n=CDF9\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"d858a9ee7f173dbdf9e52da3dd2df1d591ab837c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.8.0-beta.0_1609953205656_0.3028381057082117","host":"s3://npm-registry-packages"}},"2.0.0-alpha.17":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.17","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.17","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"67d9100ee122cdf495c12c83c6b2273d7b92a3e3","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.17.tgz","fileCount":68,"integrity":"sha512-PZhOZU7/EWS46/bo8V3Mvx7ncCPWlJym90rIoDgwxTIy6WwgVIERY266E6S62Epk7mDVRwHGm5XPEONNIcLi7A==","signatures":[{"sig":"MEUCIHi2XcPd1FYmk7D9BL7vyK1DjiOPFGNKk1VHKC6eqDkiAiEA+cCEvXypkyiR51o6YMJeZ4o/PdLSu8lNaUCu596OPRM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":539713,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf9xwECRA9TVsSAnZWagAAQjIP/0RY58uPwFftrq5wL9bD\n7Tpm7pz1pa5SSQrngv29H5OIF0/2lXIEypm6YEQJ5u7Ayqoh6YwpPLvlGzzJ\nwkRh3W7H+FYtHw8B4UkVrzBt804NgyhhrFpQo2xpUXiyRXnbY6BIxm2QIEnv\nzRHaqBorxDLQ73b6Whr9On8AKHBXvnutvKfOZzQERGhSz/0P2m0w3xOXrR3S\nQlvvLvI/DlJp31BNmlwI83lGBkNaCsMgrH1pS9tmCMh/yu7OC5QdnSzbCkEc\nwcB927ZSS5Twn0fWf4nh1xB9TSQ7BH8zCYpX6hSinx8LqGvyrJDfhnjDjNiO\nYWbTpo6TizS9WfrANsl9RP5ZTRoZ9SnzKO7qXM1TDE8LN+VP5agP6HiAxFQP\n8Z0QQ1tJHc0vzCsIOdMo6cfPsUsR+0/p2S2D7FOkxrKyAyUH3LQ7ggRt6u1V\nB+ZwW0XFp/0U4diSyAR9w6shSCtjWxlKp9ulCjbd/AyR0NBR9pjZhVftpX2B\nblJz1VT8zTJiqGr9fUoWXgzE5TXLToyF3jf5L52chl43FivzjCC2vMIv17nY\nY8Im/h3eSvr8Rh6b+YxnB0G1O9c3KA1BFKuq2IPj0XDYu+Yw1zVdo6L32o+a\njjf+A0Go4obfskYeODFgjrJSWsQFWBX3vUHY9AAQOWV3o5WfMos5h7kUx6qA\nS+Kv\r\n=ey4U\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"2a239018b9234912e21aa75ba2f92570c2da9074","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.17_1610030083701_0.34378467111088984","host":"s3://npm-registry-packages"}},"2.0.0-beta.0":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-beta.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-beta.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ad5fe196978ba73dfe253594671b1faea69ee908","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-beta.0.tgz","fileCount":68,"integrity":"sha512-BZeKry+B0If52Y1hJbcT8Q2CKsApneCg6satpUR4tbRf/gXmELE1wdm+Xg4XBaCPJAuZ9WHB9bG1BUcyKsCCeA==","signatures":[{"sig":"MEYCIQCA4Udd3lt7l3qH1WNuuwvPrSkodwQu58nGwmXgdrqk+AIhAIGugMqT+60FQbz46PmaTEnK64pOnGqxX0RZQuwspZU6","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":539702,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf9zoCCRA9TVsSAnZWagAAp+4P/jD78h/mUODbfv86tKH4\nwzYduj/3tcqND8EH0goqpjs5R6mqLMzwy4nCfOGnJkt1UAehobQ5Ae0d4MZW\ncjSV0frhgOx2TGQIVk7sTmts5LyDKtcS8To7ftnBU4SusQtLLv8UzbnPYFUN\njj9/RMzuwtXLUBK5zgIHu/P+EMdh2Yv6Lo0PRsVFR1hiehQSgXyjnWzSA/tF\ncfhEME+VG1zcdPH4mstKtk0yAetC0ubqbGNeaCSh26Z8dKf9WtEUemyYn16k\neiyQvz3O9na3lfgEqCF4X3N9FsxHogS0HgZ3db26LzfzGIg9KETgjeBpVI3B\nDKkP8xNbJ4cO0KUweltwYQzKRDFuPpFNX5CG3qZRltSkmJnsVI7Wv8H5WeWC\nGB7nrxUycf60PPzCET6tmNTk9cp7YwvHpQMMcJBQ4hG57EZcVV3Pe5UMlF2L\nNRs8nzP8Gb1rtLCnjFpZlmKIGaQrwr65qD4j8YKCELDdVpcKdxVF4s4a+gkt\n1HKbJAjb6osPCyDUxFVbsvb8RvqVyYoXSKZnZDn2l6n070SBmgCp+rd/uX11\nPcGKa/v4OoeslRT33T1lXJ2qZqX0W3c7Y0JqJNJolgW9mge68slMYPFSiMP+\noeUbTFwC2QUM0zqMvOGZBCc7kT6bMS3FvjG1OXK7e+Jvz+JtU8NNBHgquOfT\nXY60\r\n=/Ijw\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"935a4efb2aeeb3db6f400c8fdbd9ddb45a31364b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-beta.0_1610037761968_0.5799328075902028","host":"s3://npm-registry-packages"}},"2.0.0-alpha.0":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d8ca399154b5d8858a111af9966bfc5e774bf8c6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.0.tgz","fileCount":68,"integrity":"sha512-RSDyfeQbVKss0WEOUdX7ZMBpd790zlX43ByIAeAGSMig2yxYKkhXx9hi1dQMHnI9baZdLbENjXN2TpQDm0CxsQ==","signatures":[{"sig":"MEUCIQDP3Ktcra+ttWBpbNHvlx/E3f5LGHYV+JmPtO1/EVGlhgIgFcZUGAeScWtjWHKFSjbrgYFN1e+KhywPleHwyXBPFhc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":539712,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf9zq+CRA9TVsSAnZWagAAw9AQAIhTT5aTaUAUj3am+m/K\njvDbQmDrg18yBEyqlD8fAztWxP9zQmSXkP3RYlJq0AoTgfeDwOj8swfrXqIp\nQe/JtiGaf7YfX1IdU3Zm2VRPQrlKaidjbMkNfbe+0zec/FXPR0xwdqXNjgl0\nyIR/EsyS5LPGaHlHtwjOb4T+YI0j7FZgHcmLZil16fKUkT/W5fYAFX6oNRl+\nq+DbvGkOU66Ot387FjsZ4EpbicyLamssdWUwzbJCoTV+BFzYLRW2avTqAkXa\nPPFdFsWOfuDSqnmIURMw0RCt/OoQNxMsWYI3GJR/RtJg8Gq1wtZ0/WwLpY1Y\n4hGWpP2ZZ7BsalZkl7nyUJKfu3C01N+wQKOxO2VxXkqCxDvA8B1/Y3wvOxqG\n9mh3+zlbxbU3a7I7vInCdF4falnVUjBpmerVoGAikbPDaPKgT1Jx0mqwWjtU\nJkfgdXOZmsWT9N7h4miCh2UDD8zi65rSAPLN2Ayi71uEAPmYAs414VU3u5BB\nKHZ5jxwC0rA4X4PYjKvBdrre5+f6IaDMDyiKQe9n9iCIj/mHnMlDz6/4fN4t\nwWa8qP3Xao3jR+zibpnNFErsZDZz8j4Zpr1Omz9C6GNltLRuPSHhKGCHl9nE\nlxjrsBb3HZjc6ASLLBd4fQhINMT/eTuxdPmyPGIvnBSBIkkmNliobNwGyCW9\nDvHN\r\n=rzPr\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"935a4efb2aeeb3db6f400c8fdbd9ddb45a31364b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.0_1610037949747_0.7362192881478034","host":"s3://npm-registry-packages"}},"2.0.0-alpha.1":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-alpha.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-alpha.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"955cc75ce31bfbd5fa8ffd50ee2aedac19afabe6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-alpha.1.tgz","fileCount":68,"integrity":"sha512-QPWsEwT9rgdo/JNV4xI+W3Qeg94+dgEMMmXUpUcPPEjVUrPY+/rugcTwZWiz1bipFK64CjEqSwbzBLMiGqbk0w==","signatures":[{"sig":"MEUCIEV+1eVbXKpXPyZveoUE2gDhv7PJB8sYWkvmUJfTCqV3AiEAizDsf3MzpQrhQzYp6NDnG7zSdicQQ68YpHxL0086vFI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":539712,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgCGMjCRA9TVsSAnZWagAA9oYP/R8r+5ETF074z2FtAWrR\n5Lwli7chm8lQMRB3lRWyOJeyCarVeXASNDTiQkGPaNHigLK/0bibtGzrTd3X\nZoH6wYHldgCcU7M2z56vTYE4prxrfYWgt/g+vkY01PjN0DAdmIow0fvcd6C2\nVQTYgdtTL1u0VZL8Wt/9D9oSdVdATmwVgw36xu9hUGvPkI1NfwBnvKvQ0LOk\n60Fqo8r9GE0T0lP6OJqxqzeykLms6TBl2QAFAlsSjdzgxi2tPWol2qTDuxFE\nuvkSEkfJDRk+pki/6GLHnbvFgbup46WLZuae5NeiANUKiBuqUxRUfDjz6p7t\nSR2zijA3kMEPpq2hGJ8kIGkDyxGI/8lIRqi6RRYWpNDYSEJ4L5vpA/vxvcWL\nw1mRoEgDy/UuMJBaZjFXA3TtbS9hQGat3P7SLWhJecfu3taxS55VK8qJwUOb\nLjm/lNEroansBRf9gUrBhv/5AW1tpzr7ZirRdyUqAI3g6EF1C+UXTZJ1omhR\nO7BSC7SNB5db6CWoB8wp5P6QQepvsq8Zo0kEDjLBYx1TvG9mvkhFNcDZV/kR\nuUz7G/6bqF08bMUMM/npJ0J8JeGqzVygg58d9JKAwzVyo0jWVuL4C/8mKSKD\nvcQsdWse8Wbig5qrLGMR+wn0lLy0diOe2aOBOTyLMAGwpHkVyVsBdCElBrOy\nOFAl\r\n=lyTC\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"9e12b69d167f12fa42df2937cf636191b9653cb4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-alpha.1_1611162403019_0.7038394812360704","host":"s3://npm-registry-packages"}},"2.0.0-beta.1":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-beta.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-beta.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"e14f3cdfa895548808e21c9e12afa33717d9aee0","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-beta.1.tgz","fileCount":68,"integrity":"sha512-X7PRItvCbCMu4NtmxCiaLCUSn9uqoSroSIlr8+GH+ff0WVIwAmgKDMaDsLiN5rVitE1qfSVm5HuqSq8WnCekXw==","signatures":[{"sig":"MEUCICoEYq5gDIzodLPgAGTCw/SJnP2oj5R8eroTErY6CEHvAiEAvGR8cA9izm5RrBh0wSa1x3R9Eg9599wz6YxXYbYNlj4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":539894,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgC0L7CRA9TVsSAnZWagAASaQP/0nAcduF2rQzThmb2siQ\nTF64NYFW9RV9bMznyLKEOHy4SMk19XRaHR6uZamDO1A92EZrDxww5SC/VbWm\nenHVkv1Ohb2AudkcwDdOEourkBeu+ZUcoISF5lx7ZCEiqNe22qZXm1moi04V\nDhgQITOwndJX+dTN98L7FNW5G8a1iaG1bZDIntxrE21tnAz2GY9RH1zFwQS9\n3o+RSlIn7FrCh+oCzP1rekohFPvhSuSnLzrDkAFxqoH2RxrSMuF9JSpRqaPQ\noI3aWmfPMbWsre+CyooiOg0yw4Y6M//Ua2qhu1AiUt2EaYuEpYIkjdpzDPGZ\n0SbdorBLwKxNq4yEUdTOgaZZ8Ca/pgVUNFkvNC9i7t26QyblFQaelmp6l9Hz\npPv0JrZZAa9LJaq52rfk/MAMdr+XHnb+hBy75HUkEP4H+FLvS5qg1fEljg92\nhc86in2VnjX/VvPKl8vFJxhDNeRv2rMTteAep8I/m72UfsQsAL3owRSrwbfA\n+BRWZ7G1orQxUzRGNstkN14u8N81KUinY0blyCS/ml69wuhn/ZeYqQFj7fDE\nYVE4DDYXKSR1cDEAHWnzL0hZQj+yfxFjw2w0HkFzX6+PfPZwF4nBZ8QO4B4I\nRHPNVM6nnHZ26JrXVN7h6YDp5rTbz3N+W34K/N3RLv28wZKBR9dfqRPqj9ZF\nrctn\r\n=9SuH\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"9c74a4d9e0a9bb64e1099b71d27968c95decaaa6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-beta.1_1611350779342_0.19248600056513965","host":"s3://npm-registry-packages"}},"2.0.0-beta.2":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-beta.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-beta.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2e3f47d9425d7c753c5d497f4bf63006b31390e4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-beta.2.tgz","fileCount":68,"integrity":"sha512-TRFETirj0HLKFcZ2mxEk4syWpNT9nbnX3vVUPH7N6m4MdeCLPHwFr5joeES8IJJ5DJqzsoX8LTzAvvW2S7tlgg==","signatures":[{"sig":"MEQCIFtTzTcY1sx7l5K8vkQWHm+IgcRHLbqeidCaiN8ffkjNAiAGUo/O/1WH/AwRLve9swGpJFB5Eye0FrEhIcGQX5lGgg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540086,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgEbeqCRA9TVsSAnZWagAAvjcP/3mERnN9qy+w6w2TSJx+\nGCCnVP+bqbe7T5xY7rMUW7P+bLXF3Vnwf3xLcAZfHOqQhP0IAsVh+MYDf4dr\n2/s3NjXm7J1u+n5mgeooGurXTbArFfw0BF8sPc/OW8OEpyje7v8AFtfpQRXs\n7Hb4QzK4fVgowAI7IzElTcsw6hMnHFqRaGcT0/R+HQQ/uhCd2cKC47K6csYf\nDVuf3K+mNalWeCfgVjOXInPx+9fIYistMrDOfQ7SmmN2Uep2G1ThVZgWcH6N\n8aIAOdLNXga1ZAE6+CPKa7BeNDsApl/0wMqyppp8r1+qVXFJ8BpXZ9MCvd43\nIZAFDjr1uBNqvotfkXOZmOhIR7MriMP1QP+6GLcphEQ8xKWDWS3jfnoOxktx\n8K0nO4+v3Itw8QIjOPOn+OpAb/WF0zEwU6vxWW1k1tDfmaOs0Dr1Dh6AqyMn\nYb7ZZMW8pFDeOsMOIHmObTLlJM+kWxM2oioSqH0Zv7IjRV3UZoIAh0aRR3un\n5my6CKx/twNpgmnfBTOZo8laSlnX1w1ZjiFVJFntHtHiCnuBUpJAA5aybKxU\nz0q+dYnGNV/PFOQ2s9B098Rn/9I2PDbaO0gwyu8nxC5Jqgo7ebmzW0f8UALK\n9QA8/r28jCWOL9FyLV9uigNlpYbURVvu4UJzOCgvwG3+zYoDtpEp6Z1Rsy0U\nLogK\r\n=MB0u\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"a2f8f4e9b187b2884c0ee51e78c263ba053ee7d5","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-beta.2_1611773865567_0.7621541579268507","host":"s3://npm-registry-packages"}},"2.0.0-2.0.0-alpha.16.0":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-2.0.0-alpha.16.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-2.0.0-alpha.16.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"89edc0cd5c5eb7057ed620aa01bf5b2b25073d93","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-2.0.0-alpha.16.0.tgz","fileCount":68,"integrity":"sha512-W9Y0ZHn448DjpI4A6bh5lHWdOPyNvjbKv+XRMgmgVzYpUrRqxEgf5FVKy1oHt/ZPuEcKjYVbBVR+T4Yl7h5/UQ==","signatures":[{"sig":"MEYCIQC/3fzPb6JNWFiYmrgZUuN9RbfXmqeMIYC8SViEh+ZNBgIhALfZDEZ0VAzhLFmePimdqdgINUCvhxGZn6y4TdlHfJyc","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540096,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgEc7eCRA9TVsSAnZWagAAJjoP/3KxuYbR+NV8+h4S0C+q\nmVQUYAneYVlIjiib6T8KL47BjaYgTNdmeuy2dBZwM4CPWA9AoLarm+DPoyuM\nX3EieeVN2cGEKYyvWJU1unXnzsIt52EHqKB2dphJW+BbXrLfv91ED3stN7Rb\nM8EjxKuWiizCWWxN2zJmtKCc+XojPQbsYptT1H1PXhjxkaxnvpR9VGTaBM8e\n40RG3mfIGsqqmNNFef6tMyPY4J1p1a/Pg+Sr785oZWtDSw4Jcbpx7hvGOgON\nLyubAwa0jpjEz2JP4H7ZIWKqQlMDljHPwcskU1dQG2177y1kpbx9PMm7RUGV\nG4Cz1IxiHKsFCbkxwFOemzGh8SZVpBUgKyRqqdA9sJyRchT7IfUkTPHZUilz\njhzu4NdEV2qffZLD+OLGGiN/WLn9Uz7GZNCCQwj11u9NcQiaU2/wlA4TRU9K\nGi0dyijkaZpcyZLfUOlJFkbWqxa6yWIo+9OdaCFT/jxlc5OOqlHtOI8JWzuK\ntEp3x5OcZJD9a93PkT34mmxjulrVfC3PkJlggS555RhD1z8px4kAQgS4goRm\nYHrtxvocF/0yxTxVe8uv3jQbCYpPMoABKJn1ZBOUvFluY75VGMDQeKky4V5v\ntCzfO8HCLbPdXhSDF1DrxTsnILJaqmYRpEVrnppqfbt7+tgi7ufYrsNDdZe2\n8voO\r\n=qWY3\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"a49059ac4c22d9b315b6f94fc2a65775f7686603","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-2.0.0-alpha.16.0_1611779806090_0.7857472578804019","host":"s3://npm-registry-packages"}},"1.8.0-alpha.8":{"name":"@apollosproject/ui-onboarding","version":"1.8.0-alpha.8","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.8.0-alpha.8","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"73d09e7e624aec68a543e9aa6c47fe477904e77d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.8.0-alpha.8.tgz","fileCount":68,"integrity":"sha512-qNwHlSIziDFQ+PBt8wrNcuBRrPzR+Cdqv+rsarRZmtWaSJ4bR5yqkD2Ybbgu/ezZDmAdUaRtyBxrHP1KVI3gAg==","signatures":[{"sig":"MEQCICe/qZCu3RY0TV/1bHJhJXGljXPHjiAVCg8JojWjju9OAiBhyH7jnIJiKasEnyPcde90/BnD6gcACDX3WFyPW9sQPQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540096,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgGrYzCRA9TVsSAnZWagAA0DwP/RvwD9pBWALf2udj15m+\nv4m18waAItR0O3BzSVcmYO/sIA0dpGTzAO4ibSHioDnBNPAKZl7rmFvOk4b1\n+iInjJiDaWpEVXCVnj6AsahRAyvQW2FS5Aw4WN3ulVczrB0xU3gYgrDOJy+y\nymodMt2TTnDApp+F6JgB1EBu6OyhCLKgLVF9xep6UguS2mb4Feab/+GxIDLY\nCQJmQ1r/oVo0LWsG8s0BGElBNeOSnO1P4y80ywT4Y4FgkP3OJG2DwOBam1TR\nqMGR6anjbX8gnSKsduFIQ6FOYFkZGIvLKCC8VAHKAD19zp/f6gw16Sw4OiZo\nonnIzvgRM1IQqs8GqEDRmJXRoC6YEV+PA63Pkd1sXpR2JEr4t6NNTapnSh6Q\noIgrKw5R0Tvx+pqA0CNv4DxxPre4nTK71LiApTzX2YPwv9q3vg879dkponGu\nVBffIatRhME+YXvRE2Vq5Na4i5JVwtP5qoVxc3O+SWbEhUpLZMtYuQZ/qlFi\n3zMK6schhVq1MPSyx4GZysegRdCohmkt96COCAJEOHI2MdVCvm2SvCANqUj/\nDsfIJUAkDjujY4veS7tZgQlMYnTjqLnQC5GFN9xyyNQzChsYgQvq9R7MSGkz\n6RvdxngQ6HqhNY1BEMajkd9Nbtt1NNpYscZW6dQ4ud6iDFcU/afd0BikdE3Q\nInhl\r\n=3Q2l\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"4204912c982d6b217191e37769efac2aabc8cb50","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.8.0-alpha.8_1612363314796_0.8792886981269545","host":"s3://npm-registry-packages"}},"2.0.0-beta.3":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-beta.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-beta.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"869124148beab7f708752bde314d31956c994694","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-beta.3.tgz","fileCount":68,"integrity":"sha512-NbrpnGktDp9c6oTAaSEID+twqSf9cJoFekieNz+tjFaQZcQnIwF4u+8HNrbiBZnTs4N0oaQMInkdJgbPTq/maQ==","signatures":[{"sig":"MEQCIEko2wMlSyoqW2BGPMB7SaG867gT+rhIeE6HhbSZO+e9AiBXD5C2N5M7yGb7ADPI6T3cFZOXVkxxz8FFxxBCkUCuKw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540086,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgGrd8CRA9TVsSAnZWagAAwgoP/iuljeUF4fJzFgOGcUZL\nRTkcmbnOLbFyGc7tU3+SK5aHkLAMNNHn6M+aDqxlqqf/jQSeka7d8h3994zk\nYJ+DS40J/jiMN70/wPwuyVFEyWOlZQr8v/kIaVGa/MfYpBnnS50J0ZA12wvT\nXwO0P3CJbLhqxdcop2Q82qAIpgVcgiM/elrEEFx/6f8sA3un6EHmahscpaEL\nLHVGUDqUU3fxP053Ub++Ln3E3XaY7rlyvU9zc7BpoN/hu2jvPP90L1yjlpVj\n97mcFEe5PG+pIR8bIdut+nWPVJjxPVyL90QjXf2X7mN2lpFugOZ8oFmNJQbI\nq79A7fxbl43/61/MS6n1lp2xdigo84hbDtlsZBLR6ROlvxESFOl5A0hHWa13\nnYMX7PyoPrHiejZpWe/qwvyinPkP3Pt5gnrkK9XXmwuA0+SFviTdbRgn9plF\nDsM5vpkaiEkbAeNlGI9+MF1+xIHhWMwge2N2auK/qP1x0xeIlyMhAaryQLZF\nSOyU93fRp1bhCf9a7zinsL/Hn3QvKFhyiDkkW+JD941i5RmOQ6VnWd83XL+x\nbGysLmDfkr6lYqd+YVsNRbuW0wape+VQ8xg7Ck2y/q+V2jaXiRh6Sa/guIkt\niqdQHGQ+8n7YL1nYDpMfLdmvq67WhFeg3d3v1Xx+pejZYpfMIhFiWRhAvVM8\n5NNm\r\n=STaL\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"7b5122edf49fae4b2118d242b41e12e38d5d57c7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-beta.3_1612363644020_0.4688042417032976","host":"s3://npm-registry-packages"}},"2.0.0-beta.4":{"name":"@apollosproject/ui-onboarding","version":"2.0.0-beta.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0-beta.4","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"fcb481c355bda0c5344dae89e6065033b8f6b06c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0-beta.4.tgz","fileCount":68,"integrity":"sha512-OWite9VwMRnx8CmUyIbedHVYsupBFSrECIUUO7NpUMAdlxiaCW1Ibwj0LSRYgkaHknecsXTlemlM2UAEp1i3Eg==","signatures":[{"sig":"MEUCIQD5eMTEoNOx0OAvv+COuXc+5ssuIUrbp19wN2CD/U7OHAIgNRcWiWRkSrqpgHVAi3ubseY22rsx4uLMTZawGxDXxTw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540086,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgGstZCRA9TVsSAnZWagAARvkP/3NAZs0zlBa5mteSXE9b\nkCAsUasPct6PDdedbNfPBEkHa0O01s+d1Y88sFX8XbBcL/GhhJ5f6+7MhOlb\nCh9CG5K1NyC6Bv5tsujn5G9lLGr39pcze5F8pWKPuIrH6XtVfrgPk1NKN2+4\nvRlP60eIlUX7MDkYHJ60juOIdHPlgiwHhoxa0VpTmM95vmZKiKKoOq2XHlCf\n2PO4NRmJPzYeAHWXq/1XPoewaR/oLtl5XlYdxcrG7XmwRHB67bmlwIu1usfM\nMgzBScaJPpEfzuA14HyKZr6pVJhVHQUf3h/rOoYV9Sxhfrr5hjpmldIGdr1G\nlotVct96APsfqPXZO2+XmGBOAT5Q3xZla7UzGXlymo8zSckhgm7EaeZEtVnb\njpS5wd57yGrFC8adztUEoXqBxmwGBeSwJm1iH6FMQh9cPkP5qZ+0yiZbrsv4\nE3wrxQWqSrODtEHvq3kmNAnyFpKiwrDuNU+wobwtPiMHgh4+MndDXncu7/Up\nCkTDFG9BDrbgJhbbIOHbVPyiC+McRedsR04EdGDUcR9vjFbQAFf2mwuAgdKt\nwYEnJfsll+YGlHM/NeT0plqY21GEiTSNLPbkNEGHN60S5F9POL70dC5Caxtj\nF+qWIh/f2LbVx+Bx6oH9Gno91Y0r3xzBP2JlE6i/I08PdfrQzrIzGG7980AW\nTEQL\r\n=lb29\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"f3350f4b9e2498e7451199f5c146cf7e05c377af","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0-beta.4_1612368729203_0.3255181068389439","host":"s3://npm-registry-packages"}},"1.8.0-alpha.11":{"name":"@apollosproject/ui-onboarding","version":"1.8.0-alpha.11","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.8.0-alpha.11","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d56f222642f5288b90ad90401ac746c37ac5e3ae","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.8.0-alpha.11.tgz","fileCount":68,"integrity":"sha512-ST2PN77EjTcOisr9S+mebiy93jqMVjP9oM9n84sss+fOAyyRMmbtmeCDfrEARRgySbDA7vfPecpnRsAxIhwwZw==","signatures":[{"sig":"MEYCIQCgCroOojGUxaay8z1Ai530o/mAAOwO1x/ERi4vjNuTtQIhAKXxdz9hNJeOwRGDeyvI02ybjFRP1MkA5u6XfKD46qDz","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540097,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgGs9zCRA9TVsSAnZWagAAxPEP/jgC5P3V59nkyDi9j950\nWI3e5gfSPsY/OnDWP9XbmbUUh3Wy9ChUcqx/7ASINPdHb3yznetg19TmE/PS\njxOaJH4Ce+rxviYFQaAkhFEniN1cc3UUKvtl7adx/Zf0YnlgrfNb8Qryam6Z\nbSm1WTbw71HRkQWLG4nlmG7GMbRrULoihy+6KEyUs8I2CYH8iQgKvlTgWYoB\nir6p2J7D7ccV+Yr/YVev7vHeuvjv9XV/0yPecU9oGuQQi5iVa2b4dHGzgVvS\nSxGWkMOv/6hXQZ/5kWhrPYMs1bEX+obMdNxl3G2ok1m5zYnRWROt4e2JDVDY\n9KvDye2coXHqDWizmEcTKsNj+7sTAWat59dKwbs5K5UWrZHXxuYGndqDF5+Z\nOGSuML+a6TutdqNSAPn9/o1qB9IQyhRsdpvlNJQULRhIkLjhBMCNGBZqORT9\nFYDy3RwN5u86YqSs9qYLA7oJv6HLLdiBBvSuBDsCvXEKE66AqO69psofxDEw\nHtxqgpjcWHVlab7W4JZxEH3Fd5mCrFV12BUZPUzpkIo7NH33jP6Z/5CCaWUf\nhzBVTi2iu4JxCHXsuLhdDp6bzQJtcWI5NEZ9AS/Ksc+KO0MrCpCvgBlksyYa\n7ol/r8sv9x1THhI4UNgPAPLWX1+9gw/EY1UsT9owT+yk4opskwykiAuQDfPJ\niDuQ\r\n=lefP\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"54fdcf6a0cb961577488bd8d67804ea05b00c137","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.8.0-alpha.11_1612369779170_0.12536784941253099","host":"s3://npm-registry-packages"}},"2.0.0":{"name":"@apollosproject/ui-onboarding","version":"2.0.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"3f2225039cc70bbf74def00305488c218a273abe","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.0.tgz","fileCount":68,"integrity":"sha512-TYB3nwQNbAdRmM17gUrOJWf4IQGszRvUQHKXUCyCcTMzs8Ldx+Q6hKr2V61iY+RyxGW0t7XzWJXPLaYwuC9aVQ==","signatures":[{"sig":"MEUCIHc9y3IxVgzr4IlWjVx1t/QnEpX66kIGEdHposOi7bAHAiEAinRBesx1pZFmrT0FwRivfmOZ+WiVXQoTDnuIEQOMmC4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540257,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgGwaiCRA9TVsSAnZWagAAM6wQAKGcjgdQe6HP94yHGN5M\njGncxLMJOVOb0QkkHPeXyF60TsisRhsmXAEiZKi1fevGPLKIDyftKxgPuTDC\nlnBjeRIfponO3Tm8XSaUFzrTqh9TCHWDcih9/U6UnnhMCjawcwwVUBpoakYC\nM57Bxyu9DPpOMeDHaEQoaa4S/VU5ZvkGRT/xKrZS2qBBhg2f+m/zbwbEf7dr\nT6V8eFz81RB/MhF1UtUmfRljNiQjWMBlgEJi/HUaveMg4hDYVfTO1sE2zQQi\npgT/bFxKKOR2R3sjb7VCY9Pp7kfiXPxCuxoAwCKGTou4Zb6MpTtp5NPGLYFD\n3FCoE+EnOi4ZZN8b6bnwteidfehwWvLteRHExHxpOeeKsUxuhxISPl3sSb2t\nJFH+y1WEFiSY2CSdXEmyEDoejfT0bgu6oDoIWem9U4LEbAiQgXFUTPwHPxuN\nIbOjPj607VjdHpLq1U2kzhgLG6Utmf05WAK5Ccktgy5jx4fMlzMoOAK0Wb6L\nuqA4K9B3QRSgkupyE4FAtQShYLeLKiJcIVX7/Bhzalfqm+hSoUWH5CRBzZYq\naF4nxoanjabhQjO5NI+0o7n8sZcLnfjtnffRmV2a3cbpBXfyAvmyKD7GKEkc\nHyRZU+dcoogXbS1g7lqZUUTEVPxNvbYv+Z5n598ZJE7VE85FmOw4GjbkyrpT\nfk4H\r\n=69Bs\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"b008b911f273ddd7798d8607b9136a6d9422ddc0","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v12.20.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.20.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.0_1612383905697_0.11451847267048287","host":"s3://npm-registry-packages"}},"2.0.1-canary.16":{"name":"@apollosproject/ui-onboarding","version":"2.0.1-canary.16","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.1-canary.16","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1403fb8629207d84b70a70511f3cb9eba81caeed","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.1-canary.16.tgz","fileCount":68,"integrity":"sha512-2xYVpZfNKWvhn7XmYvcD5NYvrTugiKy8ofQ+YNKF4tITMr4ojTeURbcKjly00Zsnvj5TDFpl9sPHXs4AaL64RA==","signatures":[{"sig":"MEUCIQCEl0jmFgY6+e4odzWjfRS4OzzevGxwj8nqTtrM5rct3gIgQiEzY489ns694GeyjQiA9TkzLTtSiFaLfccQVCKuSeI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540554,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgJaomCRA9TVsSAnZWagAAsL4P/1pms64f2ixfzRe8WfJz\n1VXqnufpyer6ASh1juRPILmW5MqKmUnpmLpf/xYh/Zw/UNjAM/BsOx+zSeH7\nTtPH2IqJQf2mFI4wrbzYDqpybJ4u3VfiFRexF0liL3hfMHJhYEePUIKpkAhY\nNp7FGmFmim6cveCF/tQVfOa5JqHKSs75ADo60NhshOuy4Edcl1xdlPFpxLRO\ng+FUVYXCxIz4I+YSXXj/nmiP3r2tKFzvMHMe5aOdZUElhz4u4WCIFL9ang3U\ncbj1MohKGZKqqEPbGoIqiY/4cHnMFtKfitTUUQcw6S3FrsDHMmN0wQX0OhHT\nAKxWht1D2bgasE7BdnDTn6FuXgCONskZaeXXgzwFeLCv2FkzhD66v9oSjCBe\nvQZAdk5uVDXrTifIvBz6PQllTe2Sc9Hgq95ew/UJbJsoyluvI2RRgABksDI5\nGXl2lyWYIzeDQq62NJEcHKWAazojmNmC9TG9OldJrx4Itl1DwpBCmLmpPsaU\nTQPUUG14q+kKCw/xsgSBRI6rwlMqiSMgNDncblY5maJhDKOCelTeZKWPM3lr\n+nkjO/5wNGvfCySPtyeMxK3OGZbH3CBw86WAv+RtHUYTBf0X5T6IQ68MSaGL\n2Xj6Q1GNsr5N/o9JsQPLSOX3YoVWzH619U79QMoxFZWqZlaHW4j55RPfY25z\n8s80\r\n=nDHA\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"c90f082d748077ecd0bf93be1344de9b7f45a4b1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.1-canary.16_1613081126531_0.34272625579339455","host":"s3://npm-registry-packages"}},"2.0.1-canary.0":{"name":"@apollosproject/ui-onboarding","version":"2.0.1-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.0.1-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"26254ae1405a6dcf619990330ae7dc53e968baac","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.0.1-canary.0.tgz","fileCount":68,"integrity":"sha512-8xqRGSsGE1X/+HhzeNG5gAC2z18p6di0k4a5w5K7atH5X0gbOm3ZLFifGMMYhDXaS1SeFQIFItAKzA4TX0+Uig==","signatures":[{"sig":"MEYCIQC59bn043Qj28doPN3MSx4D8uDndx8j+A8ixdhiqW4hBgIhAL7kknoriHwg8RgNVINWFG1QBocjW7Q9n4okWF35Xfzr","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540544,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgJr2fCRA9TVsSAnZWagAACSgP/2SBAxqkzNLg3sPUa3ed\nJUZJ0/pz9+4nPcWUKTUOUQ7W3RVbBvLCjNKPObCldpFiaaSNO2hqGbIBZDYG\nTX4pxe07ASacq2sEek7a0sUjHsnN5U6EDj1J3iquo6rIfDYrWBcumRVQYl24\nv1vPZ3OeCJTghFqzut3+IgL2qMLlIttmbl4jNkEPI9t2IKbpJYcZI0Nk4WNS\nJbUfUNxfg2u/uMKYi2wA9x10MksQkBzQsYjCD7k0XboHwNr1vj2YWLK+djax\nMAu02AWkmZHhzissLf2crRdtPV9A3G9tFPwl6Gt+nzvoWbcR6DESDTT7ujI3\no9tCw9ZrxwsTTT7ieUGhSp9IKNcZRVqosrHpvQ0fnYY1ec6UCExy65AasIhn\ndpteRPt76bpVkzzDX16vagMfxHDzFCFJlIgjLjeyb7AxKe6Lo0LNIf7QUQ/R\n+jUDv7jeokCfeZdl+0Gq3zZlpmNvn92EdkZSDSGIQc/C+wTG1RiaSSwsaDrI\n64gumcZEdnEmp/MbFA6SQ5JUVXUp7SDEAhhDEfjqeTohU/RX9CETXl4EnnHG\nrfyfEXcmy6DgZqQwhCFP6C1qUTlIvqkurrtxqX2PvXIMm6rd2Vue8+x1Xqz8\nv3jQ3DQco+m7tPuEU5cuEUptl4r2UY154BD850/t8k+x8GKrakMkN6awSr8V\n3R79\r\n=pnFj\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"7c2905a86f080cefaa219a771ec15d660aedf39f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.21.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.21.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.0.1-canary.0_1613151647158_0.12541999670565374","host":"s3://npm-registry-packages"}},"2.1.0":{"name":"@apollosproject/ui-onboarding","version":"2.1.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.1.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"bdb9c795af21261a4a3dbaa79eddac46e6736d7c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.1.0.tgz","fileCount":68,"integrity":"sha512-/k8ETIR8F1PjBMXHU3WqtnmnN5F3mZcB1Hxu+3qEAsiwJfXRHcGkM1WwdKVwb1BFaRB+oMn9yRt3QT3ki3c8JQ==","signatures":[{"sig":"MEUCIQCwr1kpsR8dtAB/awilqooXYoyGEoQvbr8/Ew5sgJ5B4AIgR+pj1SHk764amO+8s8+FanHYbvn9Lz0ryt/Z2Ww0nyM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540716,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgOS5QCRA9TVsSAnZWagAAqyEP/iu6hFAmTZdJr6arFu0R\naSUUSSMp+63WLSlMeTa3N00stLCxkjjkmD4TTRh40zEMZJ3sEysp2t9r0f5g\n87gs7q+0AiL3GInUxZwORthcnFNoD7JRHTQusaZVehHtj3XYEkLAZjHN6B3V\n163VP6Th9nOpGml66/YfVYJia48JI5Jvx0hFOiXxPH2XAguCAmSzNomdPMBn\nelki5KSJzzlKMsmNO/iKvQy7a1zzLxjAgbFnBtXoJqTNlUsDzV9xJT7HjsVd\nQQZnpFEcIUxA9NysCPPV1Db+GWmtXCggkyeb1wFjSnlXS9DFwIuVxXhNUBkQ\n/FoWmNzMlJ7GiDnlD6+YaflNOxRHN8a9tMHhoqn0miJxTuu/yMkvpryXXDlb\nmXvjIq11DYbRj0Oy/a1bgb9ceXOEvc1vIe8YD0ugYqLQsy+7lMcmJw1SyNc8\nmAB3nfRsVi6Duxq2+gwUryCBSejmgs/oTgBX0ookG2c3Rus2uFIW/N5fhag+\n9c/sEoQf5X0njJcTdKhq3CenSXQeXX3wddz2FMOC50Yp8s9NZe21IDTfhQrX\n8hKDXFXDPjm/i0g8Hr1nfJpqr3EadmIf0tPwfMSvTMM8A3HfFBftNGaBkx10\nMb9Qe0oRGrUgukLDXWfHQ8asEhpnEvrlsXuhN0Iu3+qxL0y/8eEa4ELAzWi/\nBvhf\r\n=NRxR\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"cd31afc4f65afa92a8e2359d64c03f03f0861e95","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.23.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.23.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.1.0_1614360143927_0.9974115724860817","host":"s3://npm-registry-packages"}},"2.1.1":{"name":"@apollosproject/ui-onboarding","version":"2.1.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.1.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"0dc0668cd9ebe380d4919ed0972c92cff6b9e091","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.1.1.tgz","fileCount":68,"integrity":"sha512-ToxlTWiHgDKZDjbVwYgNv1OjMYLc4mOj+afAT3lLGYIOfe3R7qnROeNr6P446usAd7Y+ym8YnTwFwwtJqdOLuQ==","signatures":[{"sig":"MEYCIQCgx04D6pJtMMQEEJg6yYJ3ej9nIHkm2lqfY541E6OW7QIhANFnkIMQJJUeuQngx5wpKNAf5IbV0c0QHUs1aIMpaDEm","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":540889,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgOS9JCRA9TVsSAnZWagAA37EP+QEcUZi7qPUHsrxzr+Mb\nmjl/jZXGqOgdjLxY5e6zYtgD3LZ07Sb5zOjQ4yGEgD5vbSi06RArAmRxAXNa\n9aPZPKQWY0pzC7zmE7uNlOB+WR2/k+xE23U82Zqv4lyIDFcWaAKyKi75QuZr\nQQZRgrURK5cZqBSYzYzciAjkZMwkozipP4bHs4TaiQqLChlGzv88cUxMG+be\nGqLDQ2gST9d75sJmMg9H+kmYQH0IrkcerDNf3qR0SNQStvUXWReEfue0jZcP\nyyKcr7voqf9GC2SfTBnnSR15yGzbY4tforbLdjv5P+r5BoXTbtCTLqpO45kF\nhKDXLk2NNg6jUcQdKCOkCx27/SBJyvGC9gj6xnFTPO+Yo43nl70StTYppPQX\nogd96Vo1gDEC7OaG0OcrtMd6ojf70fAtBCRwSKLvZvk+MVAEMqtQb69E6dnc\nrm3lxq3dNq6UNt9kuLpzD2xnTUdeyUqMOu8a98/O6CQO7iw4ekGaEPRjH32a\nuG+uNkIvAdQ5kjXtx3eCDCkefnauy8AsPCTuRLrz6rvOleT/ZBwaXnVD2s47\nbLAExOfDhVzpftraxYspA5U8CXz0pqNgO7KMjBl00pEeHEi7o9BJ824iom5X\n2dQ56K+zhExJLSRgXGiGyW/251g3VuHXW+8zidOAsg814I2HNYc8/gJpr+g+\njQn7\r\n=u5Bm\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"d83599ec4714d6b09ede839da8394a2f66919099","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.23.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.23.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.1.1_1614360393011_0.06158040672434173","host":"s3://npm-registry-packages"}},"2.1.2-canary.5":{"name":"@apollosproject/ui-onboarding","version":"2.1.2-canary.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.1.2-canary.5","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"hello@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ab68411dfea05169ae28c4a74f5602ca75609b64","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.1.2-canary.5.tgz","fileCount":73,"integrity":"sha512-+DkGG1MUKV/XCGwseGBnrY3RUwuOPcxZQFffOFJppxybAG2+CRydXuaLVdv4NVfJR0n3M1WUIqszsD6WQPsf0w==","signatures":[{"sig":"MEUCICYS2TNZVTsXmj04YLMKv0089rIxzrmAQDcQjo+5FwkTAiEAr1O6eFJq/ElLLdSXRPSceYytcZ11uR+vKycPUwgFD30=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":559702,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgPqfRCRA9TVsSAnZWagAAKkEP/iipWvtftgV4BiLsWpLr\nTGTYSE5m+2J1cYD59zXkjnPuKsyJPHnzW+iOQBLsD8lzAo3LMPWKgk0+lPEC\nq9WNE8TydEGVfhtjBz2YJcf0dlQ4xK/nHSUeQxQn4ORaNUY/nNjx66TMxXcd\nK9WtY1n58sZOrk8Hg6VAYyp9mrzYh+YgDmuCuXtqXWUew4xRCepBI9ZLWknZ\nwZgrRC6vosU4jhekCzLxAgLhkrX0LVDvfL7rVuC8rrAVJCVP7FEmJJMRzCIl\n6zYFO3JVtAyzX2Yg7B3dJFnOOUPERMhchBRkG+5/qu6r6d4RT6N3qwj2xsmo\nlt8y+8YZ+WvvbAe3dEKdEnr6TzUFFw18FvxGv0GrKfzZRayPjRDNjb7vtRYk\neJYK9WdHl3NbC2NxnucuPquVN4+PykasvuGmUZGXkV4oxs1TrPH8F1pMvt5O\n6ILf3ajF6E9p1303fWs4ZZ4fJ3A/IDYpH9/JmGijiMniw3LwNO0ZWZoZg/sW\nPfvBPVdY8mr6mgYvyFD66p3OWX9bJIEJ1b/xNa9j+7el/ruS/+BTQjJrh4gO\nOsOVF6NIUGDX5/NPDDmYP6E17kJ420ea0x/r2ioxN1DjbbAj8C6MvcxsRQlH\nL9tS2C/qq4bH34QlnWO3Zn5QVgs2hDDx70JDGczelK730l3DoSK/lWJ4azwT\nRm3A\r\n=GtAw\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"a7b311092ee558766f91fd155799327339e3ce59","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"hello@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.1.2-canary.5_1614718929156_0.4899100625151065","host":"s3://npm-registry-packages"}},"2.2.0":{"name":"@apollosproject/ui-onboarding","version":"2.2.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.2.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d330b49df369b56863c9a14eff30123e60a41ef5","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.2.0.tgz","fileCount":73,"integrity":"sha512-sykm/tliXttLePTWbxRc4Wqtr3oEGXRW1/ytnKyeIDVfktNAG357AGvQV/LZzLyhFqT3p6sh8AEjb0uBAOq/Xg==","signatures":[{"sig":"MEUCIQCav1EjMxHP6NIi/IBxX1grHkuGUtn+4pzl0iqBjtcZtwIgIqMTAcQQP09X+TP/3YXXRR1GO80JXS/Qq4CPe+oregs=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":560002,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgQSbACRA9TVsSAnZWagAA57wP+gOr9rwT5JnlNV8nLpOD\nu87q2R8CCtyzoDXVSBSY7Ty44In9KazCo12wKli9r7kKbPWq1QdxaVS7fas0\ngnyGhvp630L3Zvq5m7duo4qMK0549vgjUtJXfwBLoXOqnvcbNK5IjhUCfaAy\n8Q+3HnCNdDdfqw1B37RhQelHCGexMU9RYc5Ig0lx0vGkww1AM8pRV0NAkfgm\nCYv6vIx2sL+lVB7RalNhUB/DxG0hpSghNWcfoI+lgWoYR+VcWzxCeZ2PlDm+\nt1I9uER3iSQbLvL3HZaZcrHrw61vrPDABTqQkd0PlM7I+a49XicL4kqMPu3S\nLbBITM5EAL+mJDkifKecnyE5NMHaDIMMp11A5ZiJBNdR2W/ayBZYsZbLGteS\nhO4x1YR7jvlW27Tto6a8clgraGLQJVjH5YdTiZEO6f7N850Vv6Fn9jaUh9NG\nRbjYJ6FmSUP/2LOOCKmKd0JOTvw7UWdKo3558+eDl3JDH7Q4+w4cAkcl0+Wx\nD0Ow7gTklabR9GNZng2zVXBcczscLbRxOmCCnymgssEfGlS6M/GqqUMb8Ki4\nfnhLJtt8vXHGeACYtzqacLbRirUfOKuIHG6B5gdSslc58Otlh56r/EKlQszS\nHoYwseWMthWRSyEKrwl2gXfJ/Ec1Cq8coS9UBbry1/qPNrD0b5pUq853/REI\n2tHQ\r\n=R2Wk\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","gitHead":"6d528ddc8fc6df84a3e2e85c1a0591f23fb1ac88","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.2.0_1614882495421_0.7637384202661548","host":"s3://npm-registry-packages"}},"2.2.1-canary.8":{"name":"@apollosproject/ui-onboarding","version":"2.2.1-canary.8","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.2.1-canary.8","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"f8cb47c07f3ead66e29890f90b0bb04213f1ba29","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.2.1-canary.8.tgz","fileCount":73,"integrity":"sha512-BUhetpFjhBwkih0lpE4Lh92rhKyChk/YvPcAqjRquIivLpVvF6iyhObbv5bxo9lnBQsUo4PH4jzg6MotOMKyvA==","signatures":[{"sig":"MEUCIDwU/nsVYBmI/WYbrYJ6T2TdTJU/EoGhQlXQANUMayioAiEAvRdbrflL/+fBSFCz6hUcw5hO/um4F6cT8BCASZh6vlc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":560061,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgSSzPCRA9TVsSAnZWagAAipoQAKClJ45E1KeR5liXSTiu\ng1fjkEeNC/M2970bFI2Ay9/2DOxF/iBy4SLsPrvv2tjQ8TgrLfesjKHPP1lS\niLrg9jJ0kioq5pBRzAsYFSEebL+QiAbqIyTYbOGozqPUwcMI15qS/Hphq5MH\nwn5UOUfHzyKhtDcO3XSlmHMLhq9om7mHalTBmGqtkv28xSyVsYBQG1pyBOeX\n/PBxmelyEH8SVWWuXnlwihvWUTfdts9DDH7b92JsDNfDzcE+8ux93kA/gXeK\np3isJ0Lb8j/GCZ2xvzmQxX93ewg3f2KlXKS8GLx+sBGcCqddLSgeayHCg4oC\nPA0p6RlIs5xWAw9XvD5own3mZr8j3JbI5OMjygGtfKSnx5Z98DNPRYhagdy8\nmrhC9DNAwVsQ8+PURqlPfqz9d48LiZgXwVAYIEEuvZvtmKBHZAY2GDO/qFOa\nX+Q9N8/3djMKec1XzVWHxe08q9IWTAD0e44aZ4qU6I2dgp4+W69R+odbRZ9L\nRWkwlL70cfOUjDiek76ImEw6sxXCr+y6cTAHs/IIyl9LghpUdjvj4PJTALF3\nUrdszt9N7O6e4hXs50D22TzpEHXR6MYjXt88ZFuEQmKGeUwFdaIiCd9QGqAZ\nwg8niP5NfURnxARgqsVU/3YJM8uXpxmM2oyHQ2z3HELgJvfG9IDiNrRdVKXh\n7D4R\r\n=8+pa\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":"10.x.x"},"gitHead":"f47ac2273016bdec57c610bd73a7041cc226f618","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.2.1-canary.8_1615408335293_0.3098039448090477","host":"s3://npm-registry-packages"}},"2.2.1-canary.12":{"name":"@apollosproject/ui-onboarding","version":"2.2.1-canary.12","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.2.1-canary.12","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1533c56054cb97f36940df331989157416d354a3","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.2.1-canary.12.tgz","fileCount":76,"integrity":"sha512-qvrWyIHlbio8s9YOvXorYU75pmN1e2wFFOYg1fNs4GsTTyfqQ77ZWF585Id6foWaIwvj1q7AbFLmJURiaBlhiA==","signatures":[{"sig":"MEUCIQDMnI03cT/6GOwoMdwoDojovnjhgXtCaL6xWk3hNuT4JgIgUCdIiRgDuL6UqnORqjZFHKaXz7aU9BRIQwbvO0s5KR4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":561531,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgSl3+CRA9TVsSAnZWagAAw04P/3noQsej21WN/Iz6nQLS\nA16eoW9ymKUm2bxREDVVyVakWz0wH/HAHZS3xNzhMmhxzac7DK3KMmwbd9fm\nucHDGII/8tyygM43fjvm/2Xb0TK9wUtA8cQ/lYFFdua6l65BMrbQmC068H6S\n6NZhBoeBU6hccxZz00jlyMxFop8e/5pp/gEZjbOrYm1TAWeMgBK30O1QlCgH\nqHU67tDuJJflQfkJiF0P9ITLC08aTahb4LdETs3PLQiJa6qtVwtJ10LgH9Es\noT0O+G1Uarm3eDM9DMaaJyvWH5Tcvmv2T1iz9qSxhabY7GKT9kI22SiroH0X\nnPts7Xycfj+NP648Opm7easVCG4v4Q1f89IdXdJorcrrcEQc8TuoGfW4WlaE\n8G6i2/R+S9vFTCpbu9q7Ip7pLKestphriDGDsQ4Zb6+h92BsajO+1Fk6iC37\nsjzXaXHr2uXsRCfQWN0B+3E6/FjCDa6Yl7LQ+5S2nmy1FEPBrpzWhLUt7UvQ\nXMirca+/oGBg5cS6XnDnRGd2PKe+Dz1+l171WVh2eoNqI+i1VgxxCfDYzH1V\nCkPmTkWajqTEWEloZIVk3/SYFAX6O1S7BHOIz+LYMlZDe63p75fcUWeSdd4e\nE64MDsOgT42cxvFyIG25bUkiZgqgB5HTjbK9oeI2KICgz9WZJeTnpROBPYDi\nQ06L\r\n=eIt+\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":"10.x.x"},"gitHead":"68d042de2999aa466f7460263db6ec273cceafe4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.2.1-canary.12_1615486461687_0.27004181194540133","host":"s3://npm-registry-packages"}},"2.3.0":{"name":"@apollosproject/ui-onboarding","version":"2.3.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.3.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"28959e44cd4c171017add88a9ca202e2dd64f7ef","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.3.0.tgz","fileCount":76,"integrity":"sha512-GGRWZKIGOGzUxr3dbzwW74Q0f5YW5JdkY0+MmC36wwNX02zYrYkP5V0Ge4BC15PPBGxVD36fov5rTEY5t29lmw==","signatures":[{"sig":"MEQCICZ5jByuPiAWzdbZCVDeLZd6/RhZeKu/TV6IpWBtdw1tAiA7Y4X5t/08Z30rdMLv6BgEtN1tcbgND3XSscZU7XfWlw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":561834,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgSmuiCRA9TVsSAnZWagAAOfgP/Rr5O9EgLQQbwqXhpk/+\n72pK8SNFIn/jW5KxbMY8fuMvxrriT1gguJ1yMfvPioaCv1sLcCtiqqKZWzp/\n9YY/E3SbiOxizt6yJOVWIMU18IAbKXiXzoB1b9polpLgNRqxoEyM8R3Vla+g\niKhBKxwGdrStQRC5wv91QUJl2TbeUTfcNIqRF+eviTE1bCRrLkzK1FwYHD0t\nril8SsHeuyPqpMHJ/MvMY7OK0g2Hr/G7TPZvIA7WPYNSCPostYagK+V1AVuz\nVp7j5L5C2mNtNJTWotyAAeUhYuDTWl4gq4mxJeYDeIdHdIuIw3TVTIvcoki5\npUJQevkER0RICsd942y4ZgWvGV6iVg619jOmbFGWxOVxaoaET4MRBjNiVhul\nciLhMHSMJ8rXpaEB3EKtMxf6LtZSm4rVBetd6BP1bzGOsUpPbF3M1LZguq1P\n1BopgphIoa65DF8FpOt36jYgvKjCwfIpA8g/fwot5uXkwBhJee1ZGWFkkgZ0\nhqWL3eCpruAi1NT4g8R8jpPA9gTO8N49eSOhXomBcw75OffUKaskD9P+iGqG\nZbEYrsPluC63N5S8uFhUPshFQC9yQm98Dg5pT6qKS8z4ZQfkar8YTHBsjIDI\nWNjpTxYjoWTUhh3cjJlNEcl+Jkvq+PMmAZFm4kuPqX4UJPlCdI+O7ynTwMZK\n9fCi\r\n=yse1\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":"10.x.x"},"gitHead":"ce1b9da4b0d172ea96e9c903106ab4a4f877a7e7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.3.0_1615489953815_0.6282101566087084","host":"s3://npm-registry-packages"}},"2.3.1-canary.0":{"name":"@apollosproject/ui-onboarding","version":"2.3.1-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.3.1-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"150b828895f3f9fde642a5ed338a6987303fa8ea","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.3.1-canary.0.tgz","fileCount":76,"integrity":"sha512-buN+HlOdeT7jiKLKvxSw0rtAeVO7JO5WDXKDQWYuzV5/zHyp+l5o93Oybm7jFqMZZv4ibrzRG+Flrhj3g5grAw==","signatures":[{"sig":"MEQCIF5o3h024aNoBL6T4FwjikO4yAcnvnEQ+aPezYfrc/6dAiBeutLNaBOkJT/VbCvx0sisMB+8d0TIj5V9SWCMTBVCQQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":561854,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgSnWWCRA9TVsSAnZWagAAh68QAJzYk3E9FNYcKMzqpcpg\nGzwMesG3/PJX0IF/Q7Hen6jUciKGHqjaIcWKh7f/SgNgzEAJ2eVi1xBCkTH4\n/RAD6kunZPUKyh9v1NM1T2A3TR429Jghf8ccJUd2sHj9yHm6P9WXqil1EFaE\nDH0vEVxsfTWTx3uGp51EhsXdFNssTHJxN7d0Bc2cal7PTganodA+1/axEfND\ngFzJoF/0OgnSTkwpJO7PbaVYtjpdRCFK2sQe84Aqy/NgWXYQkZowh+a902Nx\naRR4fLUFr7cjMXptNNv/88fG5uF1cMJwO5v16YD8GEO7A98JhiLjIhYQK7ju\nEFpjaQ2GAl4kFkeV3MMins7pw4Y7dUEH8VQWPCU0xoWmbmWIBfzC+GJxL6B7\ny6IWEnxjcadDwKz23yuy19q5mZDOiEe8dEKEBczetO/+38PxnIE769NpzFsr\n9dg3Dcmga61rbxCtVZzC2CC59xtMpLi5LcnZnN2Iev02sTShxxICGRwtgKVW\nljakgwYP4PyVBqbc+4Dy3UjDw5LDl5tGuxYkdtXGguS0QwBkK4SfheBqHAn5\nQY/tqvV63sIYOJPuh2ufqJoOMv2s1WMnxie7hELXTJjjA6uoVNGfX2WXMsN3\n162+34/NNs+D3nUmYNHg3F8BW+gzpJE9QVbZafcUJVU69NCZdE/RXM9cMNZl\nFQaJ\r\n=N7sC\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=10.x.x"},"gitHead":"a8df2ef39f7437e76becf4f9a3ef96e61bf3e76b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.3.1-canary.0_1615492501840_0.47198340268467565","host":"s3://npm-registry-packages"}},"2.3.1":{"name":"@apollosproject/ui-onboarding","version":"2.3.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.3.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4a406ef3c1cbc42d6ee7666591d0c66d40866634","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.3.1.tgz","fileCount":76,"integrity":"sha512-yrakKOxj+Yc6BSYEXCwpHlKEAktbmSDEFpYkL2enbW6lWeh32sEwc00hR41JL5iqE9ZxkYdwXXRMZVCxqdaD9A==","signatures":[{"sig":"MEQCIHcVKQM1ohL4J+SmEcPeHjupgBGmZbEcItHlFlJX0ItcAiAROMxsbvo1EZthtWHmGpU9ZmYLgxDxkfAmWWxOD+cy+A==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":562009,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgSnz5CRA9TVsSAnZWagAAPJgQAIxPHOS9GmbNOY2mSYD1\n9+5n4aJ+NV7tQZJO5Ob9nfcVTw9MgDAJgett+DgaP59qHqKHDWUrL58BDhZA\nmn5jjQWN0a4JqSKlbAGWwo0Jrh+P7aGceCx4v4qhTMv1m1R1RiLefUNpIKLw\nDYWz6QsJVc2iK6x3wu2YWG40kB/ywcbm1mdTl8GkFItB24SWQm3gfBY1hpH2\nOvOQLrl8VYUvyf/LEaCabWbbL/p8EbvpcepcMZiJkQpkxuoSmj67qdgUK5WR\nyfWTKUqV2O9UgS5gYMsV95SoZp3JswoyC+NBGq7G5l9Niq2sHuw30s+NF4e1\nXmSZt6p6BNw9uj9ssxGQnGgcMby7qji76dwG9z2pWrQmFVPvy2DnPUY7k4+v\njaIppsOXVUvuUhXI6GzfVdHkXzC63rxpY0jTk4jhOxTXZ/uyQ2xZylibn/mN\n6AN+aCZm/c2fiRMiUyKm3OqC5gsqt1ZOsaXiUcVaNj4BpbzbI5Nf07uy1Vw0\nLXLuaDIFWjrBjjIyrA4dxn0VhdwsPpSFADQCBu147JCl71m0VisFy6YqbR8p\nZHp6Hc2Zfpaj42Qx8T11DDKfHP4ayXZPCgIOpgV4x3qF+ooAkY66AQk8kGk7\n9dqc+wJ5zhJTGG6UXjILPzJJaZ3Eur06HOza41JY65Zz9cKEjVTBQDsV64Cw\nAPZ8\r\n=61WN\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=10.x.x"},"gitHead":"e0cf6a9ac9d837cd1c41234f12b11cda9333aab8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.3.1_1615494392603_0.21841666735493948","host":"s3://npm-registry-packages"}},"2.3.2-canary.0":{"name":"@apollosproject/ui-onboarding","version":"2.3.2-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.3.2-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a93aec89d212a3add88b8556d822a0a3776f1554","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.3.2-canary.0.tgz","fileCount":76,"integrity":"sha512-cbOO2qNjfPIRATSv8dzJxRfdsHI+NMUbZIn+Qzzmx5YRVuPQEH27J3EjYwyNdmtWHtrvKywolT4dhbLoIKlTTA==","signatures":[{"sig":"MEUCIQC2fx7LaJ+oDGrv8IxLTVGmAxyxIrrFprH4XuOFtyFp9QIgaj8CHXDkQwB9j/eT2MNQ87Ux7FRrV62nI3BQWVZxePA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":560273,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgSofoCRA9TVsSAnZWagAA12AQAI+m3VsOON3Cw9utbb/w\nE3FmXt/mtV6J8Yhn8igzko7C6B+qmIqSZvGTNT0h75cJXJaIcqsgn9P5Q3+e\nCoVNtTJIFc8qcpmfT5zwTZHorKZMgrhHOXWlXlXHlMKz/4+q0lsKvOxRw1Cx\n7JzyTb4ugr2HmbMxG3uBiZae7/wk6VgxIeeGtz9utQsufZNhbCCoK/TPItYc\n6uKji+7sxzkfr6kpULPJT1G9ih82AkRFtOx9nXOgxrCgWbLaS16mz6POoyUk\nqU+d2V2NyCGcgNnMKaI+lGgQ1Z9eQgFlV8qB5rChpp7ffQNsqjyqoYzWmmQy\nblAHjE8RdNvqIstmXUdoX1Sv1Xeq5xaCPY+r7klEZqxti0LJe3b/ZSrmf96Y\ntwG7QZjfZq527PdBh1vJdV3MPJm2FV4BWQ+ejZJBrwoWg10NeEHExl6LQbcO\nr4ENY6HzVduh1sizqkTtJeQ7odF6mJgiDY+5tOHdmgWrzuHLio+mGgKpDSoY\ng+kygdwDvMVUmhx44WHSx9QEIi/myc6nI0lEUdlQtsvzmc8RYH9IK3I5FkZ1\nMJotMVkAeZajMdAnvRyCPlwUcBQoJTgc4FkpGlljsl6v2jne6UHDarHR7HvA\nix30QY8Cqda10CJxEsqLmnkKBM7UK1YY7BmqUcx3zAz9q0Nm98mTSfAehtH1\nf4Ja\r\n=qK77\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=10.x.x"},"gitHead":"b85515670375785deb366c787819020656aee29c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.3.2-canary.0_1615497192108_0.2381599539605943","host":"s3://npm-registry-packages"}},"2.3.2-canary.1":{"name":"@apollosproject/ui-onboarding","version":"2.3.2-canary.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.3.2-canary.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"0c552a586eadb7e2a4970b50337ac8e73e822919","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.3.2-canary.1.tgz","fileCount":76,"integrity":"sha512-FRPkxg6N5j3V0PSAazzZU/ctFPhEuM/xzcBBLen2svVqLeFsiDD3pbe6fkEKQ3OVkMwS17bFtdghHYmw9RaTLA==","signatures":[{"sig":"MEUCIQCxkokIAy/F7UjTJSUxijUfI8Ng07d8ZSv/lUp8dvHrIwIgZU835ed6LDICRbdwX+CQy2vz8FxiRZufAavYLXnXNIc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":561898,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgS85xCRA9TVsSAnZWagAAGmAP/0+uWZR49vgxML9uq0vH\n0cKLVbL/ihtQyz21K8T5XLr6TJQdV60yA0v426U//xG3iGAU7a3B2ggB+HXh\nJW3y6f9NSaaCwvueWnDWr6/rH+K4ZM8KXO+1yLD7zHQVfLI2o9iI4pdkjDhF\nhPwHa5WpBHf6yRMEo3v0+D57VCbFtbrgARlIbVvkbsnJuRnJsYWfrsJ1berb\nptSgrg0eoXm4YMxxjF2KRpBcDjAi0Absxy3EILUbewVkmD6SSUAk0UW4/MU7\nD9rlyj8FGTWIz0U/oBgWDip95NmK/aPXNPGx4XS3K71WfVN2k3JkpiwkdVvi\nwRIm5d2qhi4DWFHFeDP8yISFKJ8cqG+GgAEoLdlK+zN7L+PIMjhWn8F6kDPG\nRCZQpXMdsYXs79mN8wHZr2441NuByvhhvfhjJ7Lb+hDjLJTzAuvJ2ccOZtI4\nqmLxHb1L1lJI9K53hZswaKESx5fRr4lrqc4C7ntDx0v5jylBbk1Jbr+11v3k\nbHG+E7c0LFhDiuXwHUL7TsNLTNs5uTnnxg5P+eQ1SEBNj5JN/lQ97B5Mx38R\nH0Aw1Nh9/82MSPhsb3E9O+oYb8iV2oat+2WSEPUcuik27SLr1lT0dCrJyY49\nKLNpHdpylgqg/i0sQv8wfp6o73IL/ljS0ZaPDpQ5xdQE1lp/8HOi2K5DqmWq\n/o6P\r\n=FCtw\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=10.x.x"},"gitHead":"c15555abf014fcd804f897d0a5dd840970870924","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.3.2-canary.1_1615580785178_0.20119131910394805","host":"s3://npm-registry-packages"}},"2.3.2-canary.10":{"name":"@apollosproject/ui-onboarding","version":"2.3.2-canary.10","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.3.2-canary.10","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a3f41b6d769503ebc9d0a44c08c9ae27a487b193","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.3.2-canary.10.tgz","fileCount":76,"integrity":"sha512-bfrozF0gdsv7GgfHB9hEahwRU6UzJjMQnu89nbR/Vhg5gxkAfIxiqBy/HF6muFb92NMKhAB77Zy9NeXCjj6Aqg==","signatures":[{"sig":"MEUCIQDlvLRA07D2WzVmqZ5WUYfR2VMv4QlHaLAFVGi3JyfVXgIgCPZAKrJhxS1dR4CsVMzlDh30ia+IxcGZlqCt3wMHE8E=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":561964,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgUllzCRA9TVsSAnZWagAAGtEP+QHB0BGsnnVY1iezLwMk\n5OL4Q6J1AV5e+tfB+EV+ljtG8/YDOmnVGWlFyKUc72PaOm1ifhoJHZFuzbd/\nIrd3gzsWWWB81Pl4Z1ArZ3KoMllsa7u6K+6OiW6b8hFbILUznPpLNKnM5OcV\n/f654YGZJAJQW5lKEh+skhNkO+eUedg/lo2AZbBomOYL+/vmOp+tZ1E9DqIz\nDn0qk4bTvnwy6oeO3FYSu0mK8xIJY+sMz3ohPqGaTLnzoTn+ncU/9DdSuoks\n+/DDHip472W4ePA7Pctf0m5800Ycumdb7qNycV3WmzBvWhx95fuoL+mw5uCD\npN4cCUtQsuCwEXLlLoDCV4yyfUAc7QuBB9EDDvjNMZvkwqX4/TwXyI3sVepO\nBSo+PxqRVPyxtPspbhkHxH3UOibwHB/HPLc0U9FTo6/3hZsz34/hVWS2gQ5y\nm+nf842D1btDAK45fcO3nVZsQWGWYnGEMGZctyd5pU5QGz0a2yfQar2dM6p7\njMITEdvQzuMD/0BDMoCrWl0Ri20SJAcsEGMME8zmSD08grQ5wSd/hDO2vUJq\naI6y/Gd8mAwucMFkn254Ayn2JdLN9WzDDQlAA4X3DL5Nf7m8oDcg6INS6ssw\n0rIE0GD+zjuVb+S3v/8QuBtg3QXpM3gKS44Mzjjv3zzwjAotGymKKFemqWHP\nSrrx\r\n=PY4y\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=10.x.x"},"gitHead":"ac590acc94c6f1d39039fc58eabf94f7cc12575c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.3.2-canary.10_1616009587167_0.32032217422967046","host":"s3://npm-registry-packages"}},"2.4.0":{"name":"@apollosproject/ui-onboarding","version":"2.4.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.4.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7fcaed398e88184f8c93734f047e8d125369ba22","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.4.0.tgz","fileCount":76,"integrity":"sha512-VFn+zIi5dCJtLK0YFOTUtUgQLas+mU0CrfrmqNp0tbvgDfz4bfeRrrYnrtZ9D37v6Zxu49dedYvSY7reC7HZmw==","signatures":[{"sig":"MEQCIFe/mos3/AIcWDE4PjKYGTbgnUXfYg5a9QH42ocCD5pLAiB03NwRmjWrDKZJyBhkYbhLZp2TtGuskpkAK6lU0xv7qA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":562701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgUp1rCRA9TVsSAnZWagAA3DcQAIUrrswBCAzSyyypgdFy\nPm26t3CVIbSCMSCKMdTwWHci4c1tSnTI3r9+1+TJk15/ZNolKkNXAR8fnw4b\n6a1dcLuSfL1EZawXRtcP3gZPNSgoBM2064w/4qCOelsltxikF87NPDpYPxJL\nzQlrcX1txAwBvyzRJfK7U6C+uePsBRqsB8aXw1zXLo+2I0cEUvzkFqPABfNS\nu5HcmVxnx6NgWSpC3K45jn/sMvkPTZ/kmTM6URx+kaUmrphYrX2djvfFRjKu\nhk5IPP6NedtT72LVnUdgtY7A7ONl3VChIJCCseqHC0pn5MPdcqwZbLF6pKpK\nxRTyrrLxJXvgQBJ7oDkncGK26PvPCLRJgR2C90ppRDg4H+grD+2Y4p2/M9VW\nIlfHX8x3Cm9JZWVvcAURA1X9edA8UdQDGdSfediTewsRP2qZJi8gvpOesHbT\n7H8bIpkAumbWNocHcde5961amgh1/5JsHhhQac3fKMMyLshq0lQbpXNwqdoL\nlvBRbNvx4wE7d8BYLKwPtYxqHo4X9BcvGPjJwWLoSBKgIvw9TI0a8rClmFKD\n9amS81nrvNNfoCz6uOKYe75C/vQGRNay7OE5YrdrryzwSW/itxDGi4UxCwed\n/xX1lyC8kGh3SPDUue87+zJHVFOnCymxRCPAsvre8thAVW6orMBzLEzi9JLN\nBzGo\r\n=ZSJ4\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=10.x.x"},"gitHead":"456175663c8003f2751dd362425471aa1c64eb96","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.4.0_1616026987307_0.6207561763899461","host":"s3://npm-registry-packages"}},"2.4.1-canary.7":{"name":"@apollosproject/ui-onboarding","version":"2.4.1-canary.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.4.1-canary.7","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a3138774fc970a12b505bcdbc2745e66f69e11aa","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.4.1-canary.7.tgz","fileCount":76,"integrity":"sha512-XOSD6jncu4/sb5eoskwizXeFPD+WxKqxs0pRiqTM2PBSl/xiwCjMi0qz06l9XUNr0JwS8xdKtZ/8aqMjSYwkqA==","signatures":[{"sig":"MEYCIQDsjxVEUZ70jRY1gUgIl5sYqUBADTzMDXyxJNhDNROjYAIhAKbaNADjUXfsqe+o6ba3LhQxOhKm4ZhWrhCe0lMdj3Le","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":609995,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgWNrvCRA9TVsSAnZWagAAq/AQAKEZtRUACFaa+OPM79KU\nRh2efxvnGO312s2Ipnm+apaUsOEU1SCVR2v+pyZiNq5LgDohLP54lS2M2uox\nMHYaY2y1lHN7wsXRN+0WVMO/CYueTvz5D9y+7ndHbx36yudIkQsFfQO71SZH\nS8Yp0nwzuovD9QIcFbxj+fh4NAm9/izeFdXLY+uXhD9uyfuuU0cfDaZmfKTL\n+tJ0vQK+NaCQUK0Rdn4xZD1QDy6O+QNDPHbvRI8XgpZtLXeEPJeMBdegr4u6\nlp2rBInwVO6XINWZ5EQsoIJV7OxSI12/HYrNbWO6pAOuF7dmsEMRuEn3MxoY\ng6vE767LdI8icbchh1dK3pJmv3c0AZfu9CtImTQVjWe6mSEJ4Pytj5QQpbct\nT2bgPAGHt+VaGWUBYlD7b9q0EjLEgecle0bfAsDQjR3q/bXmP5/GQjPmWDPf\nn2W4tF4PV+CrOpZSCgpOjIlUI8Iki8FC1Vy4qrV1ny8i7qjbRKsWv+ZAJstR\neEKyP7t6/+1+I0dEJTDTY9w1O+VTtawMzslcXAkBgwBxNkaOzkZZMyxv6wf9\nMEMJkMCcht+mIVN/GtGRA31joXBlrw4xAGiRm5YLlJSDH7ziLq3ALQYfv1XN\nXnFSWjXPWLLNpIOpiTFemvniU3OeNAR7k2TA5fQmP7HsWWbLUhV19wsHhe9E\n3LsJ\r\n=UeLI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=10.x.x"},"gitHead":"4c09ff0382c60aa011080407de5a6443d5b35db5","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.4.1-canary.7_1616435950690_0.7281050458828211","host":"s3://npm-registry-packages"}},"2.5.0":{"name":"@apollosproject/ui-onboarding","version":"2.5.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.5.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"37429fbaf146590b7786469b82dd19b69fce7b8d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.5.0.tgz","fileCount":76,"integrity":"sha512-lp4ddLI3QTAWSDbA3yb0Bo3A9liPuoV10J2UG5AtbBN/AJw4ox+WAz7Bgu1Z/62bTC+pIJQSbrUssJ2JgasuvA==","signatures":[{"sig":"MEUCIQCYPkmhN5fAa7Bqs0ONSCcyVeDJB4eM4hq5GKIApeMMAgIgMuhwcDESJVGdlvmnnFJpHvog7L3XDDhK5WL8ii5d7Jg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":610307,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgWOkOCRA9TVsSAnZWagAAqQgQAKRvuHHHD6Vw9BuGFeIc\n1x7sf2y3nv/DSxw+81ureRpR1S9VDGV5LiwaFiACgIgPLe+fGvz5Yg2ntuG8\nqfY/Yombniyxb16tmkFft1T0O4mXOdo6C647Qmkqkz+/xVnMmva+fsSNzija\nc3+8u+NcVXCGh5E9rAbKTH9GdSUsS1aJODqxzzuADUdTmqKZKwsMbFS1H9rV\nAZy77i0WRYK/xs59kLierGD4/qdkplIg3ecbbWMXrybtizoW6/uOGuHoOHes\nv529SjNgSUL6MwRQxz2WhpDppStf0zX+K/GdBCPDH1DHwHMYFZ+AnHCKv03Q\nLyDUlKM2BrtfZcvwwh0BfJXeWYWZGJmJAzc/FhGV3Zxvup7a/2k86IArfRsz\n4ykXQ/sl9uLNSbLq30+1aEw7bXtGO2QvwUyho1Ph9I00hMKinC+J494i9gP1\nVMeFa6Ke7zCxlUk6/FxWRzmEAI+rcJYZXGRVKVUWQ4bCANSsPGTFy5d96MnZ\nNp6O9rWU6xI1GV+4Cx9TWWOYYlYmNjYpCJqLKBBVVu11FEmPt6oNx15OEY34\n8Fh4T454cPGYZLD4mHV6Y+50dEKcELhOCCogsYx40t1KQsmxDTzhWPNjPYhQ\nCrZWyNQoPFBiJavCqoBHmKakYC0SWeX86oXJXnGrde79/UZZ6C1wcOQ3mRup\nBSGx\r\n=l0qs\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=10.x.x"},"gitHead":"a242b98bd2129e3a3edde14908dc817930a29475","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.5.0_1616439565493_0.22775606604206344","host":"s3://npm-registry-packages"}},"2.5.1-canary.7":{"name":"@apollosproject/ui-onboarding","version":"2.5.1-canary.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.5.1-canary.7","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"e444d8514f434282ddb0899043cf45908c9bf0ac","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.5.1-canary.7.tgz","fileCount":76,"integrity":"sha512-fjya1A+dUf/Gp/HV4M2tuzCu+4wCtBBmtezlI9zZyMGr9RlarB5O5V+PFMhrhO3c44RJNvo4Nth6OxzH5W6GOQ==","signatures":[{"sig":"MEUCIGmU4aVhh3cB3fYaWK/oeefTVgL+i+YdZXSVL0SeCfbrAiEAzZliFr+KK8MAlkIZgHjd4txNfmBhiAzKHZI20Rh13yY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":611986,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgW5ECCRA9TVsSAnZWagAAyRgP/2tjp8GP4OnwA4ZDakNg\n5ggqhz39+sF5omxKI3o/F4gYWQWQDhVGvUuIF7dMCn0Ks5FqUbZQIpKncop1\neql/8LZ/L76uSYP/r7dltLKY5rx5/d8Sz6cXJxEmm32jWfa6Sce8EVUUmy6p\naSveENtevpswscAk0gySUuvSpF3JDpuKTUdzvAXDHCekSy6DUiF/916RYoZk\nIW7Ft7ixO9gJm6dqsBKihKHNZzRGMXjO23BuXaAvfBn+HMKhaxrgw/AR1tY2\niiu6veuYBN3+QHEdNMZbavs8u24YRkFeffrI9GyPzHdbi4WaGnn938/1gaYT\nqvwNSPgboCacyDhKK8tDQ6l7q67kh2Q0zjckAa+LFcE0TiztxQ9DoIW0K0et\nu33irkQ0U+JHpE76ThbQeHFfdSFR+2iG9jywVGt9k5fC1FUCM68NTP3c6wy2\nRo5SI/X+WOv//oEluOa3s9iqAFljN8chBGiuLid/VjxBpEkk+AdcRgnSf7IQ\n6vZdeOaCa1PUlRbO+owHyO4+vRy8Ec/dtxyeBs9p6ER/p3BYRMVxAgEHFNXa\nJs4p7NA8KRfLcbIVbSSg8dUkGcq3ldBg8pmzDnrzbhyeaU1OGQKVhCJaWyuL\n9aKODwAAgWB2yoo/65sktWyDrsf+4WVxlxqiHNm6bfqvhkSEYSh0KnO93qe7\nZJ+W\r\n=rmqp\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=10.x.x"},"gitHead":"199edb8b3a83ab053964c640aa9d477ef3a4c991","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.5.1-canary.7_1616613634083_0.05358845178442717","host":"s3://npm-registry-packages"}},"2.6.0":{"name":"@apollosproject/ui-onboarding","version":"2.6.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.6.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6f1d4fb86c7a5d32f761ddca705020970a1e0f47","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.6.0.tgz","fileCount":76,"integrity":"sha512-kJuwLw+KAkWjPKnDk9eCPqEWih4eGThsZoFUf6ECtSRisoX6UsHXaI4y68MU+ttlsDz2kICO+YEXepUD2nTXVA==","signatures":[{"sig":"MEUCIQDySsREQodPLhFQMhsjoAGQnopa++mbVkLTwF17XkhRAwIgaASvhX4dESd1ZA70Xqjyz0WjPjuJ7kX4BOpett9B07E=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":612288,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgW5o8CRA9TVsSAnZWagAAHyIP/ApIvNktMqvxLT/i1U3d\nrIJo4+X9JwKpduohB2oVQQ/2wb/PPXexCujyEMyXOLfWI45HRN6vVqbT60i2\niCHoRx3pAiqzuf/6wD4wLQ8VXXF+cSaPmBwdif2q6BanNS6QNH+5MVw2Siqo\n2iy5Wm2ahWzUaJNl/FHIVCJpM6oejRjZPD2ZJvLf0qSVdfTAI1M86MJeFQKC\nofdLEFWonajaI7PSjMhDyLT4i6CNnUR6SxWncefeHc7p7HCHFsNRuCNKkuyO\negC0wGxlSuNAksgDbUaLydj/3CDEJrsZjo8u4Fekzm6d29ZmzFNYxg+YjUZk\nzUciXpJMuZFa5NjlJgl5kGrnqw8kvX7MyjmdfIoQLp5lRgbeMXkvdmcakfYM\neHvZUJpK1CfsfBkdintIWJr6zsWgzDXKF00mSWdrQV9w8csP8TwcZkqiAxak\nh93QGYP/PKSUxQboX2CUhgsVyReBeAZfZBnqbp56HiDBeNTkTxykOFdtWYPV\nC02bgd82GzqVuq8AWZUqLFu+T/bjCXed74CScXOb0s3bqXnEkHu07CVR+YpD\nMbRu9A66ELH4/0QoCtvJ8PR4fK3moE6m5O66oBN9D2PICsod6pEWTN4WUMgq\nPcMpJgvRo9EGO+ZE2Z9B6PLqzByyCAs4vxV+ptsVJbQPBdPVINCzUfu1SgfJ\ngLw5\r\n=ebPO\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=10.x.x"},"gitHead":"0976a22383bad628124850d6ebb9d9f5cbbdc1ac","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"yungvincenzo","email":"vince@classyh.at"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v12.19.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.6.0_1616615996082_0.5511243447078884","host":"s3://npm-registry-packages"}},"2.7.0":{"name":"@apollosproject/ui-onboarding","version":"2.7.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.7.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"50b38e588a6cc61556fcf71b9f95b12a4cd56ed7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.7.0.tgz","fileCount":76,"integrity":"sha512-igjpC73mSzIIdcgLZxWWa57E7Q0P59VIhx7J1pCklxC2e9RmOEUKJerPYArNs9kyCO3/2a/gTyVXcD08DeKHLA==","signatures":[{"sig":"MEUCIGppNePaPxScm0noTUZ8q6RibHLp75U/mDccZu5GZcHHAiEAkghU3C0QYv2e3X80Bh/wcHum6umcojLyJUKuY4loCSU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":612460,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgXMpBCRA9TVsSAnZWagAAUL0QAIVTOWzsREr77HI8FaY0\n07qr9wFIO4DAPIB2tCokpc7xpaOmchFtt6PX8a68gIzzoTlKH9SZMfw9lgJD\nmfOFO0pwfqrEFXBHd4HEzvQ8ZIhFrkdM+b5tlPphCXVXgCmeQzT0W1uH0QiA\nvkCZ+x2k6Fknxtd/G56HuluHMkiba8e7H0g5rycoR6TrZWziR78fM9BN9PZz\nA/0wGkJa5Mpm738jKU0B4tkkjkju96PKn9JXUdMlHTmmLVZIaZDtJ1ZqVgIt\nq0gQMrRNhMma55RriZ1HU/LKz22416Po4dPUt5mSDKMF8oiJSdt4BSgI30oy\nptO0CNawGzZ7gUpo9VmQYrQBKiTB3NQXTIF3vTJnA3zMWqF3thMX8IY8w2+q\nuOo+X6UI57pPXkbCcG1NqGXElHr1+qisZyxJ+Ou6v8AzNMyjIugGQb8x/2qa\n1aTfzHD2BWu2uz7F/W9TINS6WZrEXTsqQoZnTqCKnzxAVuMdpiBIOO/AP70F\ncoSQGhStyspUzDYzlykXSevQzPXBc5VNo4OZxZsla7KqcIZtMYdRPphs5cAm\nkKH8PxkkO5yhPADCEJmu9NfKjhEfF7TXnDNDfss1is7cPOrx+PEDT6Sugs0i\n8O6I0zo8DNJpMRZc6JYK+5gmeYTVqT3PyhIAv4SNuJvAMp7tYt0T5t/AH/f7\nsv2O\r\n=SWzP\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=10.x.x"},"gitHead":"e0ca94fbccbbe278b580b71d4b415c8779454fee","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.7.0_1616693825150_0.6797596857205122","host":"s3://npm-registry-packages"}},"2.7.1-canary.0":{"name":"@apollosproject/ui-onboarding","version":"2.7.1-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.7.1-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c5533f7fe06aee0190cc4c4eecc25c0b4cc303da","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.7.1-canary.0.tgz","fileCount":76,"integrity":"sha512-rk00qSRjbMZyTiRgHSv2inEdK6x2eMbZlvkHZvWnQwlvS/cyh6EM0+DrCZgIF/PZiiCdb0jmYvP5BL/3aBE1Fg==","signatures":[{"sig":"MEYCIQDTwYqvwd4k3eoJRo1JzFU2/M1dbnsmT13mLiP9spCPCAIhALw10KRrE4nnjzCiQe8khIihqRT315532XRy7I47gphN","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":612478,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgXMqqCRA9TVsSAnZWagAAD+4P/iZ5igiKk29rOhTYU5n7\ncmfl/+4RcdVSKvF+UthAaTnDu2+jM8HJGDcFD8uqfc88b6H6sOogZbPM/AnN\nGE8XZA0Q3lOxiP559g6C+fYOO1iy/3z9R/i8OQdXmKnIKolbwYIKU2RjWk4V\nRziEZSN4CPQGuO0+exyV/2PYawrGlywpUkmmz/vD5N2iZbyS+Wy69Jw8SRrh\nqbCp6Dxcf3xC8PxkaJ3KDKNMZZlc+rXnrt4CrMc8HCPFUECGGFNEu2aZk5+J\naOsd6O1mvEtkjc5KkRZidVxzsVTzmHfNYmQW0q3VvzkAmxkzKGXCeeiGE0OV\n07Jsa0I5l0jg9TJspnAjWNVy15oNjqBZl+e2wK+faLOL2KiPYHdTz+lSwBnw\n04uu95T5xFDoUNNby1z+RoIiY4DoE1fLsTsfjQ6RGOZ057iEUwxXSw1Tmj48\n9uf5PpPgM85vkqTVPTcs+vchxFsc3lsTDkwawHYbgCPQL066wx1Ra3dciPba\noLPpwEWuwKvIZezFHb4iVEBPAQeEM2I4RdQbBzIS5roR3GBhduz5Qdxei7x4\n1zPvt3T/wmNXPCiS4VPyRTnMm8wyiO04IMchtkrbHnOwoDfJAVyGDhKRuWSm\nkKfGcujo9Gig8n53WYxTG1+olclTaFkW8NpO/k0kIhAT9O6tjn6i5K4gm4Ek\nj+sW\r\n=aAP+\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=10.x.x"},"gitHead":"e0ca94fbccbbe278b580b71d4b415c8779454fee","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.7.1-canary.0_1616693929868_0.6071444579188394","host":"s3://npm-registry-packages"}},"2.8.0":{"name":"@apollosproject/ui-onboarding","version":"2.8.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.8.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"70f6304b87ddfa340d2ae72cf2d55ba65c1a14f9","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.8.0.tgz","fileCount":76,"integrity":"sha512-EQUrPFOQpOw5LCTsR7M2maA/43riibS1+I8BJoc7CnfHcF+PAISH7euWE1gu652DFUVSprqScD4QvNF1UhqkEQ==","signatures":[{"sig":"MEUCIGKKsXVMafuSh5f0UZV3eNcC0/PxusV6fNyTQhFe/MvBAiEA1ClAWhfBJNsBo3QFQVNqPAlqPl/4cQNs4QDvb1QVTzQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":612632,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgYcezCRA9TVsSAnZWagAAAGAP/3B8t1urjgGwkK4w2u9U\nL8APpS7ISXIwiSEYuD0smmoCC9Z/s9vLc5K50T3nHS6A31vR5SXqKRCPUvOI\nZ+Rr9F4PjyXGocJi0ajHbxyjvsfg9S6djqLtUARxcU2eYN+QWUu8WTyegtDK\nvoC3tpFMD7mKgKStZ6KBKrdGeLxpCH1QgVZu27aNjgRuo3Q6G+ZrKFXxdHuR\nUPnPCoEuxvp7uiao7RqU5O2fL3SRWhOhYwuQwh4aIRW1WYW/Z0yI3OxqPTN0\nj7bpWyVxRYysuCMevuMk30VLYJvalSW7t7LAOoJqxi2ByHBNgaLthRxvlePR\nLrpkh2wdFKCEWV26zn21rVh1QHW1iEdItG7DALonxs5Xv5HOA00A2wHGGuCc\nZf0BDO+xcIXUX9CK64uiBM8ARfPJB6vjBU2Hs3EZcXPU/s1HuQyAgfHvuXJr\nG5C8Qw+GylUYRYlpyai+3HJ11JX0GPb3cEtFq16fL4Z4btRtaacCRKYpLq+o\n3B5MCUrCsKjKAZXq68BsNtoG4GqdSj/u89KOssxsjsGi51/EGqPVB6fcWpXw\n8vGSqB6zibre+9xri5DzTpoev/FZN/uUxYaue9nGsCfdI5VwbsvHVM5EMXlV\n1CvsxTWBkI7/h3JzSYqaprdq2pxXl5fTYLiogeGPVQA0RX/F0Mt3SVktDvOz\nsiN9\r\n=g0pl\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=10.x.x"},"gitHead":"36d68e0c3e11cb07bc217a9e13cdd3466437ca79","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.8.0_1617020850494_0.2981926526367116","host":"s3://npm-registry-packages"}},"2.8.1-canary.0":{"name":"@apollosproject/ui-onboarding","version":"2.8.1-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.8.1-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d8454f2b0127040b78b4a9856d4089b8ea964d92","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.8.1-canary.0.tgz","fileCount":76,"integrity":"sha512-jScOuvb/Re2F7Le1VAKb8U4fUZTH3ioO1kY2DCgiBbz79zRnxYQlEEJiihK5oU/zZkrgyLLoEaCO/G5K2F/nMw==","signatures":[{"sig":"MEYCIQDZYDO69JhlMF7yZe1yfR9C/09Xp2PbNTCXUk9vs4EuXgIhANlT9L6p8a95MHJrSw5x5plVh5LFup1pqNigqkzfEK1a","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":612650,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgYcgYCRA9TVsSAnZWagAACvEP/3TX17nSPq/ZK/fpvhxu\nLDb1FZ7eL4jG4Xdpoh+x5P0NUHzIrr9xsdK35q9YGcWXGdXmf8JAAzPwN9Tn\nrRBOIhL/VEucfGyBbiZGrcwXz48huNHAUJ6JfDKSb4iktuD8pMoQ4vEnyNdY\nC9Ai/fYphpQ5nW29QIRt1qiBCpqnQNG0ZE9eLZdoHxDfdzbqtdE+l1HnVNoX\ng3h02jwSnUPC4i5Qamnguv2GYwGLXxvmX7IEQ4oAuBVsQFxOyADdp9WisDLr\nQM9ypfqeI10E+814yFfjyPJPqUJzzjOHGJePKQ+zNz4IrSfkaigtNUWe0HGz\nqR3EHIQSolEBjQ7Go2mse4uHyy//SnkEJz78k5PNUC92szIvfKYdVrYSqQSc\niNUDhCrjA8nFmjSJlv5ryoRMwyuriPrPTX9mBCzto0oWQ9TVxfqq/nl3pG71\nkCF9ZMQU1K0xTxXjBqOZRrpd9GXAee46JMDrYqyePfqYtPBfBlY0Ey36Dght\no091LX4eNXZrSiP3M/7VVh27BDoykAQT64+yZsMGuH0iTHAB++Tx0fQ6DqRg\n4udATpp1e4TgxIaSU1lV2j7acGMseCTXj2NTWRD4ZLeaCwN5FPqaSWogOVu2\nWVCn9T2qwSSZqPdtaL4oyCjqRYIxpAK0D7+Es7zN0O2YAY//bAPicZumvlEy\n2jSx\r\n=Qh8M\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=10.x.x"},"gitHead":"36d68e0c3e11cb07bc217a9e13cdd3466437ca79","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.8.1-canary.0_1617020952455_0.9875176084719133","host":"s3://npm-registry-packages"}},"2.9.0":{"name":"@apollosproject/ui-onboarding","version":"2.9.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.9.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"8885ec14773bd3b67f2249ba608d89b36e8cac58","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.9.0.tgz","fileCount":76,"integrity":"sha512-1QMCWvQkOQUfH9nQolyfU41ZQyrOgvOdnPbQmfl4K9Idt72EmDfggehVuF6lSCmgN1rWEMHcrAZm/6DQSxMeOg==","signatures":[{"sig":"MEUCIGSYx59sL0BPq4FtiUPZBUNv5j3W9HLTuXoQqPKWApT1AiEAgn7N/M6X/wzEIGz1RdpQ6IN6P00CLNrHhp8b0cwqCPE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":612804,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgYxZiCRA9TVsSAnZWagAAQUoP/03L+5a7JX3Nmk9dPbhS\nAJgxFxTqvMV0CPBF7a9TK1fF24PYvHsy4e1DDrPvQpGdqLb/cjf6vd5o9oBx\nr7MLgvVe22ZF9eGWi23a5kRAiw6pBDNYK67HfipS/8aO8Jln37371JXKSmwD\nXgtY9CwZKkmwNaXUQD+jmyOUkDLDko2i93uzrE6NQfk7S+VLi0Lr8K0Ufszw\nBbD3ZFQWf2AmxY6jUtCMTZPPkdky7hMLDSDEREjLuYk9ofw3u9o30+S8saNn\nDH+TnghjVigoYYfLzE5xDw0ycGuDJFKG0MAz65G8s1UQsxiojyfO+jYIqJki\nl3Z21ol5UpYlfWrJt4OFHlov9zbfuhWlY3otBL6FIoTZTwuF8OyfaIv3eGxT\nQ7Mnt7YigqTMQ2OnSrHqbLSxqKrptk4xZRhB8jhsB9i/pBgi4TKoRDDGe2wi\nYjVHWvk8iqi0GFv4LdezTQj6sM7TLHSRFca1F+W4LlTdyACUVHlR390KC1Z4\n+TvvZxGI/v2VUqGZamGVrjX6Mm3ABGH5Mwvp86c/zinblfmbnCQesNvnQoWZ\nccendySa/sVKBJhUvJR/rHqwrW8s5pvBnZlwyRDMuKghhKr9MqZ2hI32V9Wk\nM6d7J6XXsQFDLrdYfByITcHOo36c3CDHpfU5N/HmjqARffq4jWmbLOq198hV\njtRI\r\n=dfxo\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=10.x.x"},"gitHead":"8555fb7dacca51f7c5bec4d40e013fe6babe64fe","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.9.0_1617106529703_0.482769576403276","host":"s3://npm-registry-packages"}},"2.9.1-canary.0":{"name":"@apollosproject/ui-onboarding","version":"2.9.1-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.9.1-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"f3a4d2ba1ac2c3a869212f36555c7edb8fc2f37f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.9.1-canary.0.tgz","fileCount":76,"integrity":"sha512-Ut5bXhu5WlB37AHmr4wQl5pl7wIYaXxT/AxQ9LttFLqS0eQmOmlvfZLKSoX646TlHjq2kNR1HYBsz67fHSTq3w==","signatures":[{"sig":"MEYCIQCZeFS+ALeEISCZ4fPP/BSbuI4YOg/FnYYN5fuDVEmaRAIhAPO8In9cEQ2DrQ43oepKd4D4vwrHATX5fMM9W40ICpt3","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":612822,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgYxbLCRA9TVsSAnZWagAAKN0P/jDrWn2OLO/r2ZYceRZO\nl6leF1YCJnrg0yv80fyT8YeBA1ARhCJvJv1bbh+VrG1oKKkeoptRnIYp3V9K\nquUPSFlNzOI60WAItrLpMu3b7zqyhf461ELf2Y9o6ujr0cBaylDq8vHRfoOJ\nvbN4jC2OKA4O/ZsimwbKnkN5JBZPp2YVjBIOWl3JwyI8MBiY4wRvtA4wSL2N\nkZ2aDUpxhxXOT2yQxTXBeesxgLG6QAXKElD86vcBiyW+ImTzRK8H4qnc8lKn\n4+0YHFolShNm2yqFhOlyen5DkCAUElA4RlRwkXFYyeJ2/mpFXNT20mxho2QJ\n5c6lxQyWnHLwAmUY6Q2Tfzxn/+Dj50wPFtUa8jdB/NO135rUpg5OaK6KyZVH\nwwEDGTGAYybCOjc0XXqO/q4YodI7TQwUuoMXzws2Nhs2/cTDq4NXTxbpkG1B\nzyPY4ivmKIQcE3QgFAzPi1ga3YPU6kmwMiOk28GhOo6E6AbkPwJTwdTayGt/\nx31pFpWKaYkwI/XYd0aNieTpB8Eb4y6AoZyFr2Hzahtzt1MPvaWELmBXbjES\nT25NljLr275bQVkAnmdGplS1csALAiSHF5NjeYLroZfKFD7iwkcwd8hWgvno\n2jyMUIiLxLv9x5A4Rs79gXtCSR6agJc4+6g1/FQQWVAh5189dG6WSE1ARImC\ny2PO\r\n=ne88\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=10.x.x"},"gitHead":"8555fb7dacca51f7c5bec4d40e013fe6babe64fe","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.9.1-canary.0_1617106635292_0.8938445457351132","host":"s3://npm-registry-packages"}},"2.9.1-canary.1":{"name":"@apollosproject/ui-onboarding","version":"2.9.1-canary.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.9.1-canary.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5481c69bc6dd4aa2c6b670a0935715defa4d54d2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.9.1-canary.1.tgz","fileCount":76,"integrity":"sha512-WApJD/x+btPcYo4AA3eQXTwE7kQpx4gnm2RR3v4BgY9gPYFZKoBUWsA4XfGsr1DfCdZO7C0kvW6o0rBuz5kjgQ==","signatures":[{"sig":"MEUCIQCpRMOMBDrt56D4wTrKy0mSKCcMEepmC8LCQc5iy5i06gIgDyUQIkfbqsNN2VU8hqbH6+HYHxyanPfBnkYqmw/tFEw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":612822,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgY0hKCRA9TVsSAnZWagAACPkP/jtzePLcvSrxKA5BYhuh\niA3AB0fcucEr2PwNJ9ppKkCaPZtqQGw4DyXypmWkGyt782NzNWXWU++7haCg\nFip0+hnfgpz2Ouo3ApowyJXzAxODXuOdJrdpdxDN1VfyZAd66PcuADoKvnxM\nFvIQ1zisSLaG1EesIqpYEwQqlmSXHcLcAfntgFZDQhkaMt4G7fpxNywr3op2\nB0M29NQUBn0Xq3cBDzY9yAUVfJ9tU7TbvU/XtiT8iqE576lHkHhjb7HZWA69\nLrHOerXzpJc2r7qGqkEhdLtSmXxlBXiyJPjbKMiVQbUY93k6Lec/8VeG2swD\nRTPj8//aZA3AJrrr+WBys5L4fe88WCJnkOESDr8LXOAd2Ujjks613D5LXmQU\nKdrDXvptb77PvFbuhGeM4Qo/jq9TXrfye28ystnAHH9QFWMzAMjMl27MDqrF\nRIChdABRFUc3dr6EncQiQZFYJqpGF8PEh7iSCzmPkWcLjkttRDKIuyAcgyR+\n0+eDC7Wj3Nok4v8jeZM+Qkt4QCyGSRMJw+EPc6f2QGEzdEKogA9lS9NJTzsJ\n9QT1BtU6UbUkBxRgXicp9fFbDqbUWwhGJbHlsZ1YKjXweactlZ5JHX0QvrnY\ncsZcj7Ec+MAKcbrEAsCo0DIkJpDhIKgtnBoJmlDyHNuQLE/ETsqXEuYFIVSN\n2T01\r\n=5yeF\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=10.x.x"},"gitHead":"1210d6e3ad50a921fefda91cb9df99a3ee0151a1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.23.0+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.23.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.9.1-canary.1_1617119305948_0.6404291222688974","host":"s3://npm-registry-packages"}},"2.10.0":{"name":"@apollosproject/ui-onboarding","version":"2.10.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.10.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"296111c75ec225fe92097c59b65e5441ae35194a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.10.0.tgz","fileCount":76,"integrity":"sha512-vUVLrsHnsy7P8SHI/D/zbntIcfUGmpiOtJeNCFwbhS4V4I1z/yPjzErSOkB+dkIvgwjpYlv2m3su3DDinEDfAg==","signatures":[{"sig":"MEUCIB3INc3Iy2uvmGtcY0eI8BI3wXQ4Mf/aXLMa2zmxMWpdAiEAvAP0fBMU+rmAEDlMNsBfjougaeTD6rYzw6LUs+A68qE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":612979,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgbHPCCRA9TVsSAnZWagAAyCcQAIKq5A7lyPPXPvRGb1rp\nSqY+foCxDN8x/TEhAnG7LUDVfE+xcdtvEcA1ViyPQ/xmTMThrR93fFaV0fXL\nXfR9X5O3ZHC8t5ZLEagHG3Grd5U0fHZEPnv3do+fBEIuwd1BnnNbSpPV8cIK\nrXuBh3c+tBwcxtWLTT1+kvIB/xTNpQhufuBMC9EAkKmxKSb53NhJgWRYQ/BL\nTuEd+48nBP7uhgUM4yhQ+C4vY6k5G56WFmWzR26HHHP02RGKEpQXPt+bxy8R\n8WmugYjwwSu3zy0XAkGf7I256H8394K2SxBDIJlwQO5s2JJrFMa+w2zwoesu\nweyZAp61Ls8KB4KYubsT7b8Vp2s6lHmeFVpTh/YPXQw18luCfVjnnOrNCBOz\n1gISBOG74THYW3rHssoBFdgs77Y/iKTN5N+pIIam3MhjWuzczlCzY4Qe8quu\ncuhbh9nR+LzcXaXcLAYaaERyp2LocS2DDVPHYXKYntnrpzCg2oLKQ3gY79tw\nZV3TEKHQAop+Vq1H5gYuhIH2jiMJk/dYsUqYjzg1AnR6QzH8OpEGHlzXkGYC\nO9ICQe6mx+s2zVxhYvbpQ8djTIeELLTmnRnwp8gNFiYbLBTmEPA57CyzglUM\n0XN5500QptMkJMilJm2Kq1CdUQgfKgzdsUkz4ObkjUQX4gD1g892OO5W1/V4\nQXU2\r\n=NDlF\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=10.x.x"},"gitHead":"1a2e252309992f6e1c4514ad92da73dae9949e74","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.10.0_1617720257716_0.5307139315999645","host":"s3://npm-registry-packages"}},"2.11.0":{"name":"@apollosproject/ui-onboarding","version":"2.11.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.11.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c1e72285670b27a2c422d1b308fd7d5cc20e9a5c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.11.0.tgz","fileCount":76,"integrity":"sha512-Krq1H3UIK7/04l9/8EfKBhJZ5MK8+IS7sL02qzh9WlKOXc69DPPKQMS4fI/36YKG/uKAUb4WPrxZdRfjpGetXA==","signatures":[{"sig":"MEUCIAQ2t+EDBXw7xTk7M4JqQ4PQGSKTvKDX2mis38De8D9TAiEA603eFgAxKXaTjBbZNTxfDbmIVpo+oA3uTQr2+mzy5Bc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":613154,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdISiCRA9TVsSAnZWagAAcFMP/31s5EtzgCieUnqP6+Ei\nKInkqBItuwImL33zKYrNHbRAam/maESgBG4ieu9hsLtu15gVCU0d6ZEAl3pG\nvhKD5/7OiiqDBIw7tkcGLMqgRFczpOFLeve6Gpgmec81MrXlNusJIOrbXdbq\n/EiO9YjjXJ+lqHHJAo1T17SjOF/Ssm9KoyLQW/P7tdhxQLN1mAtm3LIAW0oP\nvuOghEj9bvRXaTWtrosngsHwWjnQZlMEglH0vpKx9gCF7Q24vpq+vBswhSpr\n7m5RNlVTnEvrjVw/0kTsK8QmM6B71qlUK4rPElhKrbn6Qt9EcfgEvazZpyHX\nE4C1CZU35OYAKWGTVsB64KEgaguWLm3YGqdGA0TaQGYdNT2af5cKFpa9f1l8\nWslA84WYV+BvSkaCOrqkEJSLM3+uUfaGj9PpbcLMQhI8UPnBkzdc1yk5fp9S\nvoMs++BEdOFi/EBCQvwCgsyYppAOR7XTRH+V9NOlpwa99r59YlvCp7XlD93B\nH5g2xlLcn2rmwHX/tjF+bNpjn7a1NbOFGEf87JrzNf3JE2Ky7NIOlqpyyoqK\n287LNkeSmIckCvk1HjTunsRnt0CvKgmlLWnvaWAM1V/T68SoD/0AIpP4TPtk\nZfyQfJQeZL4tI/YrbECtdUDK78nnCwKmkgdqMS/q1w3c/RGDTrA3fBvldoRW\nbnJp\r\n=L3/Y\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=10.x.x"},"gitHead":"29b07970810f5f2a566f188043c38e45a798005f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.22.1/node@v10.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"10.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.11.0_1618248865851_0.9321864987648201","host":"s3://npm-registry-packages"}},"2.11.1-canary.9":{"name":"@apollosproject/ui-onboarding","version":"2.11.1-canary.9","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.11.1-canary.9","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"20023e3b58c324eae75f1e5ff0e720a8137e69f6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.11.1-canary.9.tgz","fileCount":76,"integrity":"sha512-WQ/rAYqWABzgapVM+oxkAUg1/rijDTJ/fzWNtjN3LlyahNX60aHhXB2eC79l7Aob7EKYpN/IebCENvP0y2ukMQ==","signatures":[{"sig":"MEUCIQCd/Ls87sgppdgiPvHrpCoySZUa9f/HEvQeC8wdLuiK4AIgSOgpQTvMXVdj2EmdzIfn8mg6PHGVwh8JbZZhfFee3OI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":613156,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdx8LCRA9TVsSAnZWagAAP4kP/2rIiiORCKRf1mKFUQrf\nUEd3adtns+hTy76yMQFRIcwSISbFnrpRAHJIIyGYgkhT001JI6B7ESWGkpMO\nfsvsjPkbPIrpjtm81ciwVQ9ztKUVwzlJpz2mD4OWkZ9pVhLSQOkVrlySO5RE\nM/bTLanK4B19GMTlC2uYJSKcY/8ZUf1/8aXGqG02d1iCS3Rp36Mj0+hNz42j\nzVzvbUT+nKHiBTWLBlg2BejW3TFIuYDoeh3vV/OsCY8WW7K5LJJh99IEZFwk\nS+vJnqJxUIp708lJc1gQwIDuIpwUNLiKM9CLTQAA0KygPzYDCYSxaU9XOKC1\nnA+gZrkr4yOpQi9jOoMYdbgHjZNXr8Hd5dfGvgopOAIXRhftkMkgIsgnnFTm\n3vKcd3rEYpqMr+uvc2n3DfQhp5cvygAX1pxNp9ONlmZMEogY6wbzowQI+YzW\nZOLo3QS+zYkPp50p1uAtJ7avw3GpLaIeatOb2XFDST217qSyZdMXlzue03ow\nIr1ML1Q7dsWAxqiI1UTlPcx2Uht80CJ37BXv6qXccQGZBflLSRB6iQII9MfF\nX1GNX8+4XRSLZpD6upZRRKf/t6zVJDcaDAev2NeClY+5rVMxviRMOUA5zKZP\nJcZT0F5NAYfB0a31pz5Uoz3ZNqgVVzAK3IfS+1R2iAOrBnv7tjSPzNHNLEGl\nvb6y\r\n=YbSB\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"3ea9d4b1de4d5dd01f3b3caec4256e57e8ab8f84","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.16.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.16.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.11.1-canary.9_1618419467077_0.10464307565761999","host":"s3://npm-registry-packages"}},"2.12.0":{"name":"@apollosproject/ui-onboarding","version":"2.12.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.12.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b816b063e4240cdb928d6ba5794a8001cfba911e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.12.0.tgz","fileCount":76,"integrity":"sha512-TfGnls5l7yDFpCcPeqObWybUPBH9Q984bLGuddTVdBNM8b2vYWrmVdRAR/pOS+mIhvDxT/3sKrk7n2YfhDp0nA==","signatures":[{"sig":"MEUCIFd22KrDi5lVNWSk1Yhdaa5dVNvkeajct0Tbj2Gw8wglAiEAjphY13t9tG7/5rg9B8WJJ442P2u+vtGuhvsj7cKRUqE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":613479,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJggcbMCRA9TVsSAnZWagAAviwP/0sVenNNmqTeY8497n5J\nSa6GrDM66R6nO/3cWnvXz+j4TKjqGX4E1Gd+D1M6Mkqk8T9uNPlYTYSw72pE\nOhXAAzhz9IN1Vo86LHZU+ZzAaIL/CqwPvhe62/0GpJk5JebVuPG6zzyFt9ka\njQPN8P/lYcmEsJVJCyXFTyVWdF1dIWaC5jpSke7uus77FoT15Q3ZzgcetT7p\nCA3nh8ddQ+BCad/kamWdI1mf2jOGmexs9fUsxCoTUoTjAvqaiFdWwJEF6jof\n1FmgJW/M4uIPOLNdxvupeLrPMLdMDnLclWQxS1U+ix2HSgBW9cPxa6jG89Jn\nATN8IA+QCgMVOgYezZNsJwEE/1R+bfl68oM2ShncFJ0NNKRicU2CFO34HnNs\nUYR1SlK9R02bS6b7fbEx724ExpjZ+Ym9CkRir2+T6z9u6DxbcYepZChsJfJx\n3ytdc2cGCX9qvn3IPKCvgPX4ksp+Y656ITvaht38wqTAy7Ou+Fyiy1XOarKV\nfFEz4iGB98+Ck3sdhZiYHaFmOQtWcoZtk/lwt3BA74bzr/o8d+07rm5DJ0V9\ninBe5uxTo9NcbvNddFFnmtQtBcU8CIJOXMTe/KtFNCXQqcv2EJWumaNENfVo\njssUMABezIojwQpQLSmM53RFfnhNHKu4r4URkhJDZAXPkjPfzQ6RrPzCQVXP\nFYQg\r\n=IkYm\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"6c493f963ca10aa1ca8122a4a210aef5675e269b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.16.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.16.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.12.0_1619117771865_0.9584998940334912","host":"s3://npm-registry-packages"}},"2.13.0":{"name":"@apollosproject/ui-onboarding","version":"2.13.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.13.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2bcc0d021c549f4994b53228565c918d560046ca","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.13.0.tgz","fileCount":76,"integrity":"sha512-mYsmMKEdWnoW6caFxVajnq0monEHNyBTqoLq4Ke3/p/NkS6WltFkOUTuCERlE9YeskrJcFmfsrV3RlJ6PlUyRQ==","signatures":[{"sig":"MEUCIQCU6g4HYsJiq15WWKmB+b8G0EY2ga/t7T4YfPhwN5mzlgIgKYvukw/CQ8A/0m5p0bHHl0oGG1inFZ5z24kavW7syO4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":613654,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJggs8LCRA9TVsSAnZWagAALjAQAI4IEBgyNnlAONzgX6aL\nPHbjdV+53aVGuxk6raToTuShGxzlXlIqxao4McOyxmmqqKAhlx2+r6APT98p\n/ptov9LwmHV850plyS3AEiRpUEmuH/LjzP/UI5ySx3SnlxwUFikNQGI9EOQt\npernS/+mv1G2y3wSz6GL6QLshJR4ZorBIE2jUYBEZg6YmiTVEWnaj+myD6O4\nQqAIQ+kp6aZD2IG8GwpENwm+PDCE6YUHjrXwa0rrQtVgvbtdOpaMwX+0Qo/F\n5Cc1MtX8btYhGDI4hPkG+IA0q5ArMSdfoub5u705LCINebMMo+Q7ZL2jtuln\nJaZoRk0+f8t1ZxeE88dk2isnKq2BsMWxQdxMpsAWMsYIayMtKKjemEAaAiHK\nkFbtJfaUDv8PpZdnuKg2qU+WQ5COpvRGS1Z+NZcIjIOfiYdfUO4qRucalsZj\n1qfCiTBLWNFRwnwhqryUqoss6OtOnoLXMCiFSWz0vGnaFcJPWz9j34HXoP2I\n2/VUsXz0N7Y5pauDBQoZxmh+zz53WokatafcEvr3IyWsXx3dzxSQJCTh5ZeZ\nWWkSbbviEWR7YbAUxmAYhRoNGvG6MBWlAIYTTHMyJdWN+QvOwFBQiQSIvM/1\nYmQLAKCRyeCgGTN3l0XNzNsa4Rw8XCfS1/lhMUDVKMdpJCdyT1MGGMOnUDW4\nvHwx\r\n=mdDz\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"6b98d8e8d65dcf56475d1d0a2ae929a6ac8696e9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.16.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.16.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.13.0_1619185419436_0.9840705065722819","host":"s3://npm-registry-packages"}},"2.13.1":{"name":"@apollosproject/ui-onboarding","version":"2.13.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.13.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ad28106f090e1b634673d09e7afe8503bfcc62e4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.13.1.tgz","fileCount":76,"integrity":"sha512-Dy3ULmVO6tbG6ZBRf9zHuFTEAa3fSoDSp6mMiD2yDhWdnXLZNn33G2If98uHoxoIjUTO4U51K+nEV3WvYyhNqg==","signatures":[{"sig":"MEQCIACJiXsWzOGc8hc53xobfMLlUh2VUM3M+pSuZsC5eSF/AiBTHGAE2Fd1qywq28xJIh6MBEEslr31dN6rinmy54uFLg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":613830,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgiWmFCRA9TVsSAnZWagAA7boP/RZpXLlKJeZkU2ccAEFP\ncOHajQ6DAEXY6rq3L1Kfg+O5V6NH43TxonG2zORr1h3IpYTKWjLVALCyPm9c\nVr95OcBCIBJz+ou5PHow1yQNKU6svW3aaAb6Jcg8O8NbGxYaUM7UDCvl2HHT\njH1XjhWfUrO02jnkRtvpEZuYpv3kgq4Yg3hI1nyNShdO4+9w9GRnQ34HyFOf\n6I4DQDxA7BTCf86GpMvMmcq1txQbzfaP39PdzwtIbMTnQWyzuK5Sl3SmwH1c\nwheFlVLFt2nabABpwmZpDdKYD2C6eEk+jpU6PQPMl+gY1ddrcI2A2jRRe+1z\nblXKEIihd25AfuxzR7vmoPzuC78vt9ACcm0GTIQ+I49XofPXsbnoqbuTLrSK\nRGxgPP2hw6JFX9AUfqhbyY9ekwCjtAaNikuQUVEdw7cdIKrR7FG5NR2TrBZ0\nDsKYv+09UNSVFrH5u/y9cF76HoK9qFoqgb5nmkxSOdfm8vrcp3UWF2klz/UE\nxuGNFWC+qZ10G57MAshqMEfRejDZTyHr5aZfSn/SvhaOp2HMlPXN9t8eGXQI\nW9Ys4fJ5kOrS0nYho2krARCzg7mSl8nXBUAjmDm6W13M6oT/HyzddyF/552U\nHd7z/79s7uU3VrCXMxxMEvHfyxkSZ3cMkit3RJaq9OEPlXLGcJzkIUJucan2\nYHnJ\r\n=Sxne\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"e79fd4fb9028cf612eb5280969a5e7804efc51d4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.16.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.16.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.13.1_1619618180878_0.8174577190965344","host":"s3://npm-registry-packages"}},"2.14.0":{"name":"@apollosproject/ui-onboarding","version":"2.14.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.14.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"e919d1d7d195828c87cf524690baa0c2f3e3b239","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.14.0.tgz","fileCount":76,"integrity":"sha512-y6eD3pwJ+YiStYxki/QRHxwQDN3VUEzoc4KiwkUH9/cRMIaHCaZOe5x1nz8OtA8ff77UJUk8+WVEu0MHrHKZZA==","signatures":[{"sig":"MEQCIHvDxuGGT2UNQpXHinI56uzYqs0gnYhEAr0NSgvNjYljAiBRtHtX73YzbrnbJYDf75fQAH9wA8Fq9Vtm2v6ujjEjdg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":614005,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgnpleCRA9TVsSAnZWagAAWucQAILDNUewc8g2n2fOQ1nl\ngTzdPwy4HR7W9Dr9QwaJtqjeFOplOIJP7LjyX6rGJkokXTYMQ1aycHED/EGt\nd9Ir/YsYTxzR6ECTaRsHKpIvuDWyPBh5SLpmu3EMsC8mkfsr12DBUnx+C2a7\nua6503TnijE/JG7nEvVQobFwGzpJZYKAHoGCmiGfMMH8uehV7JE9LSv4LHnk\n/yU6qUQWmBuJOna3l6P+xBw6LT/gQ9L8IeDyLsXEc4hrdO1/fGntiV6u3ZvT\nByrqkXyE1J8GXMmxuGm7LUbCXLnZ1DPN0jbgBrt9A8l5R7V3CYPkjTh1FnyH\nIFBqxh8ITP193RLG7aZcmuP7u21UwDDH0fzeVsNi6kPPjjQRDIAdPTpK1/b4\n1mMVN9NrXCuBUB7TJOUqbgPB1vEc80jYo4L2QcitOzpPpgec+2XwSsgo3DDZ\nYAhfdbmdokwhV8tC9+uCZILzl5bLWlQmx5AKIYuxNhcKEceYSUwHlOlvYb39\nuS/xk1I2F3ypfRezJEJiNEqUiUB6OZVmj0BRCx/2PDztkt3ePO8PvxGkL7bR\nW0BsFouqyn9mgTTYkSrA8jPB/0z35PF6VvKrXnGNVKgybfVgEEuQUXyHE7Zi\ntHyUY5Cy6OUM48fkPUjRdT0aRm51hx3Dg2UDRK3IVrzO5qIQncYJok5UzhFu\n0kxF\r\n=gHww\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"a967877717651f0ffc9f03d4bad3d27fc2433487","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.16.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.16.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.14.0_1621006686367_0.011444302528637484","host":"s3://npm-registry-packages"}},"2.14.1-canary.3":{"name":"@apollosproject/ui-onboarding","version":"2.14.1-canary.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.14.1-canary.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"04954ad0b1339849eb53423ba37985992d71b258","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.14.1-canary.3.tgz","fileCount":76,"integrity":"sha512-YxIXy6E0UcuLlIhtnp6325LuZ14xpP0mhAoz1DuG0ojwXl2ryQVzhsy5FLfgXS3w1nGbhZLm4rstUm3RXmVPWg==","signatures":[{"sig":"MEUCIECY+CkiuPzRJaDHEOkwk2f3PpWRGRj76Jyf2uEVlcPiAiEAkBRz2vFieb/UP8kuWccFIoVGY72AOZ+bW/aFi12RyYM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":614239,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgo/kuCRA9TVsSAnZWagAAo+gQAIVM9G1KfJDoWEUAVhLF\nGIi9cYpQrrrLbeW0se4FIcgJodpL/KqPE2HWtxtrUIkh2C7byQ8ZkbS/8msJ\nbCrz+E7QUXD60wb+yqrILYBTZrYvoIr5sa85Pzd1ApSDSl3sUAo46lTa8KO4\nPZQ51wAP1Ee0WSjv0bLN2yznM+cyAX32kzZ7zigQ/bs9p43Yj92AZnC4S4Bm\ny2AVB5prau2Q/gagiMGnexszWkwvz0ggzMSaGCm350sM0EXjNeoumeTUNWSw\ntdee7wIyPLjZsh/+HPN2HCzBadYguP9KrAin2hnqo6XhGneYNMTJ6pdzilbJ\nhuEywTjzPW6wKGTSBuL3CK8FG0lxpTh/tRyFB8lGGSmRwIJznd8mJCWb67Rj\nlZssLBNBR8tRizGqSoTkP8R6U0FJbMHrbbwACP9VGlhwo2z6I6ojUlar7G0w\nryL5HBEK5a6NWX144IcGDKm/kvloRsms02iFyUZmckWecqJ8RphR7GNfmAxA\nZUanpTvDc1AN3Y2t5W/7Tpne1Dng9tYW7KUddKnctxxw7IvCECOn/DZ5MIIZ\nGfUcV3n/c2rbiQ9Pyx2nE0ePmQk9tLjpjHpD6awwGlDjdHbAbFmKUYFB+7OL\nKKX8Fc9ItEo9/aPxA4coHvtGRUQN9kroOqVnOx34M63uwHW/r4fvsXV5L3A+\nB7VC\r\n=RQIP\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"61bd00c2f75179fa234391867ef57d8dab6e6c4f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.16.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.16.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.14.1-canary.3_1621358893497_0.30892960479609877","host":"s3://npm-registry-packages"}},"2.15.0":{"name":"@apollosproject/ui-onboarding","version":"2.15.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.15.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"357d2eec2f143b4b534861ba27a4e3e23a6fce6e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.15.0.tgz","fileCount":76,"integrity":"sha512-VEmcE67Uwh9dV3KLRypLObf1uMcyFFMmMjdK69sb/VlYmFmR1HLwTAW6cfzjUWTg6XSJTWcvPuteg0FFMF5lHQ==","signatures":[{"sig":"MEQCIHWEPXqTFDKMd+cGtid8BpPPUCtgbnj1+fjZMK3nc16XAiB/YGWLf15SJJS+9xE4q3YqmVL7Rnrd5SL9EHkbeVYjbA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":614559,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgpRtGCRA9TVsSAnZWagAAemIQAIJoPajvBk/QB7LM/jDW\nFeuuld21zufZ5nMJo5ZcznmuarKiPMoA72SipAiacGUh5kdUdSZwMF83Ktvh\nHZT5USUExVaIfnfj8ePkS+7nbu58aB421padNKHdfs1NesRu2+y6CEGZcYoW\nV/TQagnB4tDLOX9ank1KilEDVbJcPkKptLNLTPFnsVG/30jtIbzwSGnaEE0H\nXicrCVifQmk+O7D0auJevjeYwE8YUE/oo09QHFUGs8qLh2ltlk1byEgL96Q0\nd1ynVvU9gSkfnnL+TJIaia62PBlWFgAL7jjJUrrsoZCVzlRvR+VVt5SCzdup\nSpzvkv7zJM7D8EXVYXls02NKb1LJJEaLYtA50sty/j6bfXvL98csKzTcdhI+\ncKoiIvgB4QI9engUUrk1CldfPAPoYxeSy7HHtKC4jndFa7nZX08h6MiuoMXd\nwubeNOx+D/xyMs1whxX+3TXdSjp44n2a/29E0F/jpiacBx09P292fPMU1Owa\nKRrElLdh9aE9X8Y2fUagjeJACBqfIm+C31CBnIx0jl6nQLW2YAk/Ci/JnBmi\nyPCO1116TKhYtDNX+c9ZlRfV43Wr314uQqZiyqx5pr5IDu7/6/Z172ZCxO8Q\nUwbNNOoC+mdWMoh7ON6t4RcBpblhSQHZrHtlNTwoM+MH8NuGE5hMHQkF9eXy\npcAZ\r\n=csEc\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"cc1c7061fdd962d1ba4c987743a6cc6053d365f9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.16.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.16.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.15.0_1621433157819_0.7749841373173674","host":"s3://npm-registry-packages"}},"2.16.0":{"name":"@apollosproject/ui-onboarding","version":"2.16.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.16.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"8b7db382fcc2770276ca3eb06ce8e3e998c88527","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.16.0.tgz","fileCount":76,"integrity":"sha512-mzH6ECH907EFlMNWBrsCoqe93HoLgD6QHWkkeysbB+SQG5lLMrtN8QHwGMLaIhKp70Tp96iFzobGVtAin8H4SQ==","signatures":[{"sig":"MEQCIGKnAbQfu3uPifZr66/+QfDb+yu7im5B74Mz41k3FR+AAiAgFHZ5/nJZe5VRo+RMndr4GnRtH1LgHSSwJ9PePUQE0w==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":614734,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgpm5ZCRA9TVsSAnZWagAA3bcQAIFESplwEb6n/U8LO+lm\nbiZTP9KnwZozcCxhdiq2YLjNQtIEOfdMESSAYPo+Uj6Kiye8oX/De0Oz1pFr\ny+hm57p7k9Pjyv8jHGkA+mBwRTWHxUnYeqzqDvdGAC5lnF8u73S88BC9EN+n\nFLifcKewJAKmgpFWX7c8jRlydRfPs+ogi/G7ZyJzr6M+cjTiaLOTJcTy9VKp\nYi07lUXpLkwSUqg5QFuFei4uAxhhK5h8McWEHTs9qMhUXAcHaYly0spIXobz\nWY6HnIT6Scqz9XUU7VQnwNie6y5BQqBEuMk1AXOUzRuBwpw8qCAKsxDJUIwm\nYmkDoygsVQnErZlrwa+4KENdQiXey15w5bQeLIQFTf8OYXHRo92KYolfBYCw\nedoGRvjd/ZLrhMTvClAsTJjgkK2l8zQs9d0YqeCsBIAF5rVNp8+/q19Uottr\nnNIy8c6a3ZfPAo7S36QraNNk6OMa32E27aE7WDvuI5UM3kcN8LiLKbfZA+AW\nk3UQ624BvRZU2hX8TP7ug8mvGL4aMhdwoiKHRq3k5hbklYblyxjCrAY0/KJf\n+wLwfAQRZlrof4eZKl941cMDTF1fZrzyuRWc0diR8PFUlYjyxnt4uzQx6Fcd\nv0IKnroYG9JfqFSNuV4/w3umuArNgNNVGaqocjVacKF7ga47Rir+o9lx3COl\nLufc\r\n=bz1f\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"ad284a0df6c7802af069bfaef61e51789697a4d8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.16.0_1621519961507_0.3168272563995922","host":"s3://npm-registry-packages"}},"2.17.0":{"name":"@apollosproject/ui-onboarding","version":"2.17.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.17.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4b685391d20983935667a886b21f4ca4a2d693ab","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.17.0.tgz","fileCount":76,"integrity":"sha512-PYveCIOEAjwXuqGATwWH0kXpK4smJWQWr9dgVoMb3wShH2OQxnYyv90bqeeZ1I3Sqgnl/6hAx+mpmw3aaPdQWg==","signatures":[{"sig":"MEQCIHyFkgPQ/T7u4PCzE3dzSuoKOcp8qpi/fJPYxT8LlyLJAiBoprsGIZWcBwD3v9HABra8EPPWE116ZLtjcQ+2I7idyg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":614909,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgq/NzCRA9TVsSAnZWagAANNAP/1CUFDEhBwyxreId4WYW\n3HLOa00AKEgsL9H8Xz6SJ7OVTfmSG3l0TiNlWrXCqZLvzLObyJJtHVlxUOzv\n0cQh3Tabyn2SUQBGIFmp4pUBWkGofeTQJVMC314zGSoa2/RI2kxprUBWwNQK\n4l069HQ7W75JubvPDvlSC0EDOQI6EEfNieX+3JGL6uG3HV6gYFfttO6l4eHY\nvZ63nryXjKP68zmLMqg7YZVRYbH0aUSUNt1YgSGrebSKmiSP8323i3yCoR3O\nMsr7ADjESd7hyjpm5zXdAxH6EV3GrMqWdtf65QWM40k7XVLiX5F59vKkS5y8\n4g5qXW78hy7WdhjfpcqnBTU3dU8QNRyzAUB4l2WB8u0okyRwLtTFsynCuAul\nxrN/PfnHWyUoVz2y3aBngCQOWPCgTwM3qtVqfzU1SlmC095XNJdpmQ/I3HYt\ndYxEaA55+DQ5EJtkslNG7dHcGmz+ORMHJuRkOZECx9TqKjTtIj0kr2/CmSW/\n+J6ntjV9NvBQRblyQMJUKAa46Jq9lqbH2Sm9r5TasFdMUOO1FE/3jJI3XpUt\nlkKA5KVIb7IIL9n4Mss/ivjWvP/Yj6o1Na1w5jmL+UobgaRaSpkSixiyjsZ8\nz7Th+Iw7+raWe78v4KgpB+7xLDQexW+IDRJ06tWQekSooYFw65x4I40OMoLk\nPUSE\r\n=0AXn\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"008f0cb96c1a1c1ef39a35216e906d6eecd3f11a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.17.0_1621881715303_0.0013232689984210566","host":"s3://npm-registry-packages"}},"2.18.0":{"name":"@apollosproject/ui-onboarding","version":"2.18.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.18.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"caba0873c617577f49f46d4d95da07621ad71c60","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.18.0.tgz","fileCount":76,"integrity":"sha512-V5gQ0o507uzAJmYPipRNY/Az5nD6W4ffJ50+qX6Jeia7BcfD1geaT/OpeLd7p2XQ/LQJZ8CtTUws0p8eT8ovng==","signatures":[{"sig":"MEYCIQCBVGLT554DqEsm2gLOiBE84Qq4jTiSAMeLw765GnBtmwIhAJ+ckMF0VBSiZ9vWhKLjN8oU9d+hIolp5S/cvipDk4V2","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":615084,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgr+OUCRA9TVsSAnZWagAAVuIP/0GygzYLX/wc2y2AGRY8\neUWFiPQHkX5d2OPrm47y1hd2UBfKovaaSEaBcWk2OKgNsbmXz3bon8DrGxk4\ngG8G8N/Mdmye4j57YjH5GsR57iM1MFD/UxHE2+183lnxYD09hzY7kkwsrtm7\nzMYylHEGLDu/m/y3YbdvjrdGUJVcfpNn2+QYlcmFadQKB2I8+P75IHowkF13\nS+pjeHEPA+0FFdtkRaidJkp6CUjfM4eKG2ieZSOvCzVUo36Yjq4fvMV7pWFe\ncA5NeC9LP0OUIt7sdVO1Dtu3kBa/asiBepaN542ju7gyA0VKFICLGSucU7cl\nJT0QIym80jmZw+8uvTDWPf8bu1DMac8YUhexmCw3N8ZQUZLLuctW4wmK5YfH\nhCKrkC0UfRfOtI4oZnWPuQtX3EDylXlgmLMH6Q78Pt9dFO+XYGFEptAfI+wv\nNygU+pSROSV06Fgxm5J111zDpdhAeLMh8O3ZnzjEH+EBbgD6D3BaLkAxzUvJ\ngE0LkJIXQFHm20K3ZyDsKaQjzEdI9Mg6FNw9ViQ3ufyYJanORhlh2HRpsPrB\nAErQRdmjXj8U5uW1lbXAi30Y/eCwMwXDZSs02iEfSg5o8qC6WX5AYmWYs3Ee\nHCJKRDkjN/wQQOGQ6162IprlSROkG4fh2ecpOpA/IK1EZAO/j01T8gL4I4nI\njGQc\r\n=sW9c\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"ec65d9c8d6eebaa1f85e64a980e8af7e5f41e6fa","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.18.0_1622139795662_0.544076910598198","host":"s3://npm-registry-packages"}},"2.18.1":{"name":"@apollosproject/ui-onboarding","version":"2.18.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.18.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7f10a9e8927336652251ddca91dd542953ec6892","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.18.1.tgz","fileCount":76,"integrity":"sha512-oC3e+tasshoFJaADJ5IhUMqMYuNMeCUBsKzMjNjdAgUbEAZfuyrpBpJOtVoKhLWT8sfSjzs+Tq6bNhP4gxeC5A==","signatures":[{"sig":"MEQCIGCxHA/maPvBQ2aFlol5PExYTpT2rSS1SMXUzrssw2EiAiAcc12m7mUb6RnYvWQKRaXg/WBVNDDscQY3/4yWx/vkZw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":615260,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgtnTxCRA9TVsSAnZWagAAJAgP/RTUvCFYQ5N38sJ7KRKg\nJpb7imUYS6MBT5rjza/Ac9KOYeOLnqKgubBaBNUX80Cwb3VfZ+lHvcw0xdua\nCW0E17R2heLDreIs9kYr4xnw0pyYckshiN0yRnS6WvQ60sRi4aobQNCgEoyg\nrZAqPkrpoonkhfANZ2BALuz4gjXB1AhKs24u2exIGmZaFMTlT/inuwwdI8Hf\n6RqOUbO1bkq97Khj1sKIRoVqGJHhPE5A02/KlQsLEFUIBonagBfdJXNitTuX\n8Yiy5xt2cMJ1a7W2IxQE/F5moMBdqHbmjQbQU6DuTou22rKlldchMP6TElQ0\n5LTVhcC9YZbUIbl7DPoDCOKkrmPJnEvkPkEYml6CGeOB+fL7gauxpfaaTaBZ\nxnW9g0/7oQklM3ujOFJh5ojNtBjKjNWx+EdMrRMWtbmwNA+BvDKjqg3lg7/h\n0+cjyiZlqMgCxaFwDIRfbP3f1E2FkOjCv1MO9bu6ulRntHkTwqtS+2xVtSyF\n4VKkImXdxf/MTjZJeTznZ0jDbZyUOt1X4O/ZQxnWn3TdTpw4ylliP7zIIJYE\nGEq3h/6X+5GyIWC17MSD8e0Gq+Ws/8umRVrLnUQdWRWQPT54bBvZFFb+0UOS\nggtUDY9ms/wmn6bvtgzuLfwZyOi4vksM8SczsD/rsUKVgdqx3D/TpJ6zWigi\nv6x+\r\n=iKS1\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"94fd41c7dea0690b83e5e8796a06c7bdf0a7ab98","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.18.1_1622570224920_0.6513532748445334","host":"s3://npm-registry-packages"}},"2.19.0":{"name":"@apollosproject/ui-onboarding","version":"2.19.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.19.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b648f7caf79214dee760948e0283ee35f3080d3d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.19.0.tgz","fileCount":76,"integrity":"sha512-CYMsH77gHCyBENggJB1FsXicE/P8iucap9VKdpvImMx5OQe5kvTo2muWQeqXRZDFCYaYw139RtSEGSGdYq/OdA==","signatures":[{"sig":"MEQCIDJ5MvttCiV0yIF3Xx76liwQdBxnI48Vusj+DaNe4CJqAiBwJWLOGNurHYk0FOKRrSSXroRsAp8jjUKImbBOg5i7SQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":615435,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgviRpCRA9TVsSAnZWagAAJSAP/jwiDBJjnDPyQ6+Ebt/1\n5RQCpyghD83CEb9X8yaZz7ixqOPs12kO/toKwEmF4I+1IsoXBuTR1WZTEGGm\n9Tf9E72eEjzznTTsoMysHU1jUw5jv09YQRqmFr+2IGm/d+i8oRKTG10Z0X3f\nfC6RgWzLEuMUwoBPKbhWkSHbqLcGlr1uhSJN/Bb764Sgz54GHijRpYX9X56z\npTT3I9ZuOTNIJNPOPb9KGqhMjMxfM9cSEzVDHM/+oG1hvRAiFsSzIDHQuCfL\nA/oIppXrNNnFuommgmy3pcIMAX3nsobXooJHQzOPlxlDy8YYFSNX3RdD7PYD\n71m29Fe3aVZiros5gYugRjTjuVp2xSIEGS9R8e9MEk3lm1tkMGS3gzv+n4S/\nGdpQ2jUxI2ocl7V2TU75Dev8uurK+GN3fn6KG8KlgLnqFB6c6ZVaEUKVPwbv\n3SCaHS3qVAKMP+B09Q3SeLQG2IxbAq3ok50VVBfb3DDrCsFtbTwmlWuox8fK\nIixmXqCBCC98JpKMEUjqf5iPAiqkY+MdKIZI05J8hWwLbAkhAP08wPAPBhUI\nlTgllY20D8dSqdcw2edNBLQc0CeMIiH5y9tDJG3CkA2DNgnK3EKwQ/TCAxaM\nNiZo1fal2U7gTgLP4cCTJ2nAeUDKFgB2YCZZcSKGf7xKhfZenJK77k6q1XZZ\n6rRl\r\n=basl\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"9ee85feb3e1be9718c6996ddeef78b2a5aed34e7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.19.0_1623073897354_0.09932992692536824","host":"s3://npm-registry-packages"}},"2.19.1-canary.8":{"name":"@apollosproject/ui-onboarding","version":"2.19.1-canary.8","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.19.1-canary.8","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d33e4570748fa594ac7b7a629429dc688f7a44a7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.19.1-canary.8.tgz","fileCount":80,"integrity":"sha512-hQ1zx24mU/wYfa16hnChgNU6OOwWWPrsxSbX1v+31I1bo/qf7k8H0QAU52JHUbqnCKiQ6ewMU+CB3A/ftve6GA==","signatures":[{"sig":"MEUCIGX/l3JZxofskhWF1S+VzV+VVXNVFmLRREeTsUXsQSEjAiEAyEPNvQOkoExoqh9jLPEX4w3A3VsiuuQp39sn0m0Rots=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":678515,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgw4eUCRA9TVsSAnZWagAAiasP/Rv96RqNmepX98eHZut7\nNxlXn4QNSZuvWzaFFSyNtlHHEvGgYDAK5nJBLIbSzCN3xtjIdl4AINDdaY56\niRLfdMx3ttsHsAJcXGSo9Wg9FDWnEvh6blE3EpQjE08WYaT3J62XecTcFXG7\n4ljZHuC8/3QL9XD7fB1pt4qdBK3HWS/HTlfg8Dd1RjIeNNl7cVaIkwFODyxe\nin8FnfjwTet471Na3wRM+GjJVRcTrdh8l8/B8gFOIvPUzUNM+HhTnoa4GHfO\nsHQM23GSOmd8No/0/rJFR/tYFbvG9jFcV4cr+fpyA7RZ1uqm0roICnJniHq4\nbiTqwjJ/IbSpkbNh1OrtoyEkbRzjmd/ua6q8/CTiui2m1a506ZG7plvyCQ1W\nw9MXzqmw2stMCHW073WHBSwiKr6/XXmNir1fX8flUP3Ei20OOA9eKnZuj4WE\nLiSZbRuJU9m32dCl8MXg2tXCbB+k6ELuBBGTdb2y+O5LhAFJ/ThV2Y5FGsS7\nGVVIFv8+JgOkvjRqUb77XPygzkXYKEqP6dNvKWXRI2lCzXhfCgeJJBqm0f8m\nu+SbK64uv6Hs4w+rKbYxp5q0dzVkK/MyYC8mykcRbIyP5Vv4eRW8owMDc1aQ\n6nIfWdicTI70ZHLjRz2l3og0LTEf9il3t9+DBIMpXZLLcI4kVpMkqJIYb/HM\nJqiz\r\n=f7wh\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"d42bc48754fd4eaffa44e1df6b367aef0576bebc","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.19.1-canary.8_1623426964550_0.6783660702289234","host":"s3://npm-registry-packages"}},"2.20.0":{"name":"@apollosproject/ui-onboarding","version":"2.20.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.20.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"bcb68715a6842d9eccc1380bd3274e61cca5ae8f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.20.0.tgz","fileCount":80,"integrity":"sha512-I56cOyHr9G6HLk5U5EWhVvP+iHOWqsHLnozysR2ga94ANvg00uQKT3bI8JR+PIet/Y1sMiUR0Ycv+Z96Zc5alg==","signatures":[{"sig":"MEQCID/DrENKExvxSNGD7wESZgSbqcqYef1IZoNSfLXSwo0xAiAN0Y13NWRQJekRa1IuTIazy99nixdP4hJVkqvuQmTNsQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":678672,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgx082CRA9TVsSAnZWagAA58kP/2DabkiJjdx50mz/TkWs\nsPH59fWasBsjg8f6xuTXZ4rhEU+R/jsZskuVLrz2IyUov602ckqLIgozWwkM\nQa850zJeG2RYUr3EDdmFOYtDah7LORvoJ/rT7dpwGZB2jXO4DhhZyb8vJCFj\nnwGL9BpZ2B390Vj16iKSh1IGVXc2dS+JYW6UBoTLzggmRaM/q8Y/twrAw91v\nJlZle0r/RAq25WRPZEc0aXUiY+58CsWMjuBTtNRNDzPnGwO0Sd0VYxVJTcjP\n3No31FmeHvotAnLC4J5vgnuhDD5drvSrG3xsVwibTR2yeMJ5uZVGP/aNF6tv\n7ZClLTQpPYVG80MpV/08K/pyTnyvZR9lz91WrhEZJKrsIttzfPqwtGILyhPG\nUvrcpFgBExWFUzzaLgFowm713kHtB+F/k1X7lgRlDczWq83tUZI3nE0s5OFu\nyJuLIZMSr4CJYcOzhJJRKCl8cICLkymiS9LOjHrUH/HpE/ZKqocpuImnFEK/\nqRjesLDnrN1typ+hQxfR/j+E2wTLYt6KpKasEsDWNmX9cbOlnDuhOamW7hg3\nce5k3hKJP7whST9fEeVGMWbhteDuZS2P1D+e+ZUYKFFahWKZDLIrvvBJyD32\n761/7x3CJ/AU532K7iyOW+qZroFxZrA+pWfzdlz/CtXtrLIztLC95+MoylUO\n4xDS\r\n=7wNo\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"1495867f88c35e8462842b7f09aad1fb29d896c4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.20.0_1623674678219_0.8288879873871253","host":"s3://npm-registry-packages"}},"2.20.1-canary.1":{"name":"@apollosproject/ui-onboarding","version":"2.20.1-canary.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.20.1-canary.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7445ff50f9a6ac2292b66059eb91aea9322a7013","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.20.1-canary.1.tgz","fileCount":84,"integrity":"sha512-FSp/vf6zSQNhKYyJyX8rhsVooHiDnfKL4++Ya5iL93Mo6iU1IWVEz8wuYXynqXFKzPddmEArzdb376PcZ7BKPw==","signatures":[{"sig":"MEUCIQD9C4MeOLQoE9rWsRuEpeFmOYFjYpHeSbtB1KYUUMEsVAIgVvreXnTtzE5nJIV9BToYCMLjrQRGIpdsIqBFwQT0gq4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":722119,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgyLN3CRA9TVsSAnZWagAAspIP/RAEVZBdhEx9qo1kZdQm\nYCTsDjKUz5HQ3jjKPigx9H8ZX2ZBSBftAZTzmnCbI+Aos+tkSsv/EmMCc2NE\nDir+CDndR4vS1DLYCjZmJXzAq+5p7mqPO9tMqPHq985S9GNh75rc7gkimVey\nFUKoivQWikp+Y7fRsTPeZ2kMoUD6FA58kIULpCy2tu+jSuHLnOK5kg+V5yxx\nyQT2mISNkbahoxd9WE4Cb3TtuubnVcwsBlfC77To7pCpiIuLuxrqEw3sjgdo\nx84oaBnjy2lKwi444lj33NnYnXymBN6ov4FTxr8duJu8qinfwCVUFcPT2Dh+\noh1Wfh45Q/cuIzTXDPfkF4tlQPRe45/CtNP2jJzOXNxSc0WG3eSWOGfj0pUF\n3h/uDD/Qyn1fAS3vaMeDQxQZcXhTnv+mrQqOF/k3QDcF6r15VWHYwt08vbV/\nbRvVRDI0hCV3jVYSclqYctY4c9T45Jc/fePi8INi4bKuPHhzheD5U/K7Db74\nT075JFnGR4mhdGTXWJfA0tl0l33Xc4y30Byq5CTueCFiJzd9vrx7MUGo1hae\n45XR4g3Vi9C4Fgm7Fe059E3e+qvDcA1dhtgEMk9vOv4he6zgUDHCN+H3gXVd\nQGvGa2qyi0vaYyBLfD0aPmg6Z9pcPy4wnPpAMMKzwGbbcLKk44V4tCypAsgQ\nTwz6\r\n=tpdU\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"ce20aaa1a2def57767399eb8501b274362a0b474","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.20.1-canary.1_1623765879793_0.6554055668365941","host":"s3://npm-registry-packages"}},"1.8.0":{"name":"@apollosproject/ui-onboarding","version":"1.8.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@1.8.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"700bba57248ecb2dcbb13107c72d0f1d7fd1102c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-1.8.0.tgz","fileCount":69,"integrity":"sha512-zpKeC2DfrMYn7PLHXdp1XrIuQ/unOD7edxHYWEiV6pMRJ6QUi4ck8OEUOOfKJSNm28SuRkOkj+KNmmHhpV5u7g==","signatures":[{"sig":"MEUCIQDPLJs0NWCsGPlRlL0U6jexFOMzwk33Vy0DPOupMQsZogIgbuAFKhZqwRJV7zqdD4NTegYhl/NAqj6PYEhlARsuuTk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":559061,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgyfZ0CRA9TVsSAnZWagAAYK8P/0UV51z2mBhhXFBpHhEn\n4JVFP23NE8keup/2BfDC91OyJPoO99bf7YGK4aRlMFIpXitbkjhOeL+H/gz7\nWzae4L5wrzDOtRJHZ7ucoSQ3vRXU6yL6CwH77Zzqt8RL0mLmTDpp05BFv76N\nypsUUkAoVDu5JvutvEUVuSJO0MsSqfdMrPzzl6NI4QFOfJWxZkNpCuqr1hsP\nBITpW8py+h0FIS79VdtZpq2HVrdxt6P/W/GPS+86dnA/3aiGPaJZQGsR88mL\njn37mF2TMDEosqryXGIUn77DU/Mboo+ty4WwESmKCWcgnt38tVs2tH8rzVMq\nXByuFjSbEkSf4Jj4whIAQGeTJunO+ChXUw5aWmGiejO5rk2IdYc0UGH0A9u4\nyiKjlExjjrIrnjtfhEpEX+gMBzIemDcEQL5mfH931WSBwprUex0wAnRMJrn4\nM7vag48zrvZiRMMVS2sZ39dtc8ikuCpoipeSN6pGkL6LQVxt294Rq9C75pVa\nDG0JHaD9JQRo0WMLPhjbsLdswvdONUYs2AEmGFYSjAZbSfET0N060NPOvB9J\nfHuozmnBhKEQW184jM6jDF+aXsKTxw3S7vC0oIDLmnvLDaNCZI+Vi4spv1EO\ntWaAmaIB3ArCHJmjKhNww+4xGp7MN6bs9/zpmZCWQwbM3N9zcGaQ2f5sJRbF\nBcjN\r\n=tpKX\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|react-clone-referenced-element|react-navigation|@react-navigation|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","gitHead":"84eac346b4d986a773a06bb8a9cca2c3ddc54245","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/3.14.1/node@v12.20.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.20.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.19","moment":"2.22.2","react-is":"^16.8.6","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"24.8.0","react":"16.8.6","waait":"1.0.2","prop-types":"15.6.1","react-apollo":"2.5.5","react-native":"0.60.5","apollo-client":"2.6.8","react-navigation":"^3.11.0","jest-react-native":"18.0.0","react-test-renderer":"16.8.6","@storybook/react-native":"5.2.4"},"peerDependencies":{"react":"*","react-apollo":"*","react-native":"*","apollo-client":"*","react-navigation":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-fragments":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_1.8.0_1623848564118_0.9273126640965206","host":"s3://npm-registry-packages"}},"2.21.0":{"name":"@apollosproject/ui-onboarding","version":"2.21.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.21.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b052a6086e08d8b4cd2c0c68e0e7a70ceaf5f4d2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.21.0.tgz","fileCount":84,"integrity":"sha512-mzguTkNJCrDzq1aeR6RR/7r9VKLMpSiWDgtVw2vMU2Z5HGxJD/OpU9a91OVEmvhTv3S/p4qRHFlQowCt7pMMXw==","signatures":[{"sig":"MEYCIQCZYBLcgCKW0Fv09+y3THVi72VgAbAuTEaI+3sBHrupQQIhAMJ5La9xWmGK+7ZH4AyU9U8DHQ8/vRAmjQk00ZQkDAvJ","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":722276,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgymReCRA9TVsSAnZWagAA+SAQAKBWZOgRrTiS+0jYn+PM\nVca4IXKCDde9bbzz52kKNA4JSkt2aGB0lu4sYiVBbbt7nIiIbfviCeeXSKAk\n4xon2hQeOO3lYfIIPA7KUq8830K4zhHD0hRY5d+KKoe5gT1ng6KB1gu5mrqr\nCH73jX0KR5SjCrl9DMjLb9Lzx8Jh5AiyKVw5aTV0B6OB3o/8BbbTt2H7FnSW\nYxGqlaPGqbBZfx7hlEEUzXIJPLX5PlgiIyNErH5+1/+/NkW+Hn3OMRWvp6Xr\n3vkdpgt36nnJsoUSWT8aJrQCZpwYmO0A4vqVYfyobHXFVCnK/NPSh2t25lJg\n2zlfm+M9ij66bfupB84XWbl+58Bl+kMZZp23Zbdg2EIBxaT8VLlCWN5jWhlZ\nyUcdqpRG4IXqfhyHkt7O8NvnJ7p/UsEMcNJEPLajL/g6Lku1vHkACf00crL2\nSO/wxqpgiSB/JztvesE6/896FJrJniDHCznkt9omXXJ3aeJ4wpIUhxPy/EMd\nb1DI7trL+CIyu/gQ7HPqI9wbTg79VgxIThs0Hbj6ujAEe0NwOXcsmGDuGM+H\nrC6TcA6ZQ9CQvF6aTASUYB5vokvQJ7NAVFF88KAGMwfFYjdx+ndumX/QoIXG\n7Y4udPKLgpMcZkwBrxBAPTbGFX5Jzg68t+ZZeoBSIYbQoTEOv6lJfyNwLC4e\nDJPW\r\n=61PL\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"e005cdc1709f1c91ce3ba308aa65ad2532a08630","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.21.0_1623876702424_0.9643374170919097","host":"s3://npm-registry-packages"}},"2.21.1":{"name":"@apollosproject/ui-onboarding","version":"2.21.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.21.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"08e63c3bbff3cfdd5809ff20479b01836842d8b0","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.21.1.tgz","fileCount":84,"integrity":"sha512-sW/xTDE/84xCTI7cp4X923/18v2tD8dn5vj+oPiU15Em80kfHcYSg/rgNlvungwASvVe+1ceewMDS8xloDwaOg==","signatures":[{"sig":"MEUCIHPs+m6o1GSvZqIZaCfaeFV5Q9QVuGNuTctbwQwg4KI9AiEAo9fyt5hyNlp8+SXw+CbhoYn1P43feYLKzHi+/dzQOHs=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":722452,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgy25rCRA9TVsSAnZWagAADlIP/0rVONIwzWG9lw15YsoV\nUNf5KEhogEWneixbkyqIWVdFJVdzgHkLNBgIEwAwM5TDRJCooiAGjTBZyXGl\nuE1wd/b+EnNw6ygPrsg7HoYZddqmp+Cxzq3AajDfB4s8s0u2XrrJI0fPZgDV\nCBWu6JVEOUN+U1bJYHSLNu0Xd/Up3ifPwtX7urAZAFf7cqJsrDbdgHC6R5lr\na0CxIxMtAhKLkZalaTpCoJFoWXLzjvLMHbViXkWA4tbnPqMXcrTPEPjyfSh+\nmEAbL7Rl6lROapCb/cFpZIsuONlvNBygiHKJUultp6LDOxUwYHrnRN4FZvvq\n+BfIaF3RDNYpDroZPNb1NeXIezVv2Mse03gk9ft7ZSiVitQYHxUWo/pyWqG/\nY2NqrIuXK1TxQs4DlTAxy68W8+XIfsbvt+cM3xB7ehlrqoxyB78SYvfDateP\nzV6YsaC9acIY1+nKIS2EgBce4mgAAbk8ltOVA2ot4nZ59EaZT9V4VyKf3zfR\nSuSjwKIIMxlPs2+1114ooR9r3xFQg4nX0HZ+roxbB63kOhOvea5fbDzVnpJ2\ndLderUxOSRqRs8jyJyJAYND+DAiNx4R91UHUv5ilKG6+sVx8vtGih3jFqCZz\nJBQj30UEWFwXcubWPWvwFafLaFE57ij7ecF+mKhUj3SEOaS764Yv+oM8Aeo6\nrxcv\r\n=8GbV\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"ea79f438b8c422ae19803d793f96d44a0a4d98af","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.21.1_1623944810751_0.6733443915958504","host":"s3://npm-registry-packages"}},"2.21.2":{"name":"@apollosproject/ui-onboarding","version":"2.21.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.21.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"93980b260367ff676f36a5207bbdc69fe36720b7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.21.2.tgz","fileCount":84,"integrity":"sha512-Ufl0x/xP4Y8QOk3UTtVp6jfKTkEr329zrYLo5/7wsiX6Q29+y+9GGtaS5qJtK+Y3sKdR5lVNIwOewXcCiQL4NA==","signatures":[{"sig":"MEQCIAo4+uXG4SQALBqVFyCvtN50Q+Wxdod2R3D2hq5VvWJ2AiBsJueYc9mopWEZQC8WnVtde6+gWS/pyCSiN+bGmqc/Mw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":722628,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgzN2RCRA9TVsSAnZWagAA3WAP/RZ0lMfzOzKu0+iGXggU\nWnmnq0ZrBqefnxYPdgaBgQwUPlcat0QNwmRhB+YrCivO51mBJ3svF+NKBdHx\nRKt6cRu7ePkLIqCgQld7FAtBriN37sEVlLPIiDZzt9g7k2jJmZVaY2ebh4LY\nFI/7lX/FltPlObxvMiqO0WQDq9dl9/fGVAD29NgU/kkx6Xt1Mcljx67TuuY+\nRP87X5yRysHvbdt9UC5/NPg6xSg6M1wcCk7tlCRM2ZjoH95hYb6CwI3wWSPg\nJr0Nuo28IiafXwwv7iCOUDXQWHtxVyoQvmsazqe+SPLuoZG4KzZ3ZRy/JPBP\nURcTkqpI6fNHbrQ/PfcVsJXDKbJjLzHePlcUezUyZfOLDOrEjjF8Wt8XvIae\nnV2BtKOQBIUZAHM1q8Hcep81KE70jyXXwsf5xvX4LA8PtsgLk7UvRRQk7vkH\nAOdhRpan9nyedWdjRbexuBT13P4RhnhK62HBzTfCT0dtcc70gewj3rpJwpd7\nIuqNH4ZcFJe4sQLU2PTN2T4SdVzHfRR+LBm3xoOeMeCGMWP+wJ6HgwD65XVA\nWcRkRVpTr2P7Hrh6p4EeN4msVxh+66EAqnbSETPhhoHw8oj1wKaPSCBtHNKE\nr5qI3it9Mr7uQJPI5WvklFEy5u21ao3Luy2lG526brRxUGT7zqCBDWVqrAV1\n7OEe\r\n=LKuC\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"92fb733c108694c7deed1f564b3eadbb19c84dd8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.21.2_1624038801390_0.8306111390314301","host":"s3://npm-registry-packages"}},"2.22.0":{"name":"@apollosproject/ui-onboarding","version":"2.22.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.22.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"fde409a5684c539d3d93141a081c6d8137b57d97","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.22.0.tgz","fileCount":84,"integrity":"sha512-0cHqBedUONxzcjIaFOBeAvkJLLaCeqieua9KCMVT3tLcRZ6vFOG0qPLjbwWu1BF9z5yi/BlcaAFQSfq4oQqwqw==","signatures":[{"sig":"MEYCIQDQLDwhvd7kQsUBj58evFgLmwLvnF78H0Sh2mBsSac/BgIhANU5iSfeSd+AzN4XMhyUM6Z4Qa2//Wu8PIHOWk/MeBze","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":723425,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg031kCRA9TVsSAnZWagAA5QEP/i80Xs2ffcBFtpx1ZIF1\nykNff4qw56luTjdX3Ej5HoiSId9+UBIpu96gzu7VQPY/s0QN9KKcW3fMqyJk\nVxmzSWfQOxP7HxAj8qDZHcU5LZVlXW/akgYra4ObZRkUFbn1CB8twu6ud9zu\nBlBumaQHHX++9dtAyovafKYreu0d8rSVLUNdkvy0P6//3vNGu9CIPXcU/KTx\naq0ngdCnT4+yVKDJpEfxAbxAzc6y/ibS3OFw947T0jLM8uEBPqahEtTG1EDy\nlqhqvADQubt1rJ9AmWiHx193gwvv3TdbyReU0FDehZAo9a61lER8/b6ExbIZ\n6bMGRAJiV2EsXPY5YYa8SQZ2eJtLAVpSb/Kq2qjxc9xJsLXYMQLNhSiBHIIr\nLYjvG0RtEMQ4iNdsWHPSQ3NO14d/AEG9Tl2RuKf7qGdEbm5K2aSvoTL/oxWy\nNwrt2zX4M/hn3RQ6iQpLHX1nLS++ZA/R6I4BsdI3zSGUdHzSXp9VEm18jKQO\nHI7HyMb2cfLf0/dSnoVJAEWkciMDj2aihI03kHydbWPFy4Gw0ku23dzfuJyB\ncqYQLRDb/AOzHXUehuy5f3XQiFM/KUSF8PSs9UDG/rgMb/FW9nMq5w+zSOkE\nCNkrcsjI+N2V/ajqYANvm5fpXK0dGnCgKsz2csx5wh+BVrH7JydAX9GM/3vX\n4YJ1\r\n=ikQG\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"cb462a535f0424635319d010a8cf51aeebfa2512","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.22.0_1624472931878_0.5122824807180482","host":"s3://npm-registry-packages"}},"2.22.1-canary.3":{"name":"@apollosproject/ui-onboarding","version":"2.22.1-canary.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.22.1-canary.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2ebe65cf64d8db204e03c203ed9e0ae698b37086","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.22.1-canary.3.tgz","fileCount":84,"integrity":"sha512-W3pANtA7Hpgcmh7mzumPJO4PS5OlBf3u9NW7bqS9y4u661kHNXbKOWMbPnx2L9uQUtIfALbnRWRusLHUj2c7xg==","signatures":[{"sig":"MEUCIAM6N8qRoity7t0GIW020k7rRrwAxR66XivEAi43bXd5AiEAgYwuCApJ5hh9FEIpArZHmJcVniOM/bKbSeIzo9qJ5mg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":723404,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg1Iz+CRA9TVsSAnZWagAA/PAP/Rw04Rx3N81JiS7ikbSX\nMWm+gIpHpDkuHQ1aVX6DIQ5D03DhBRVQrB7UFUnQacD4HtX4EVrd52BtOdEo\nln4mZAwtn8SDwXvO+u5BF2yhZq8jy890Ugl7hNB771vVYpWmSCJ3QVc36BR9\ntxmFnWTICGjkY0wAZ2hCZnzggASUL54wOylYq8L/1vIhUncRVCnkUSAx2TIG\njg933vtzdunOB9NZOfJEEoRF2diQ+4t1yYGGRO4lcEDhbEyL2VT5fhTanpPK\nCwLFsifBF+Wn+bdlTBppusSz1v9mj01xl9XeLXTNxyxy07Fhkqv2xSGauZt/\n45ZSbPtrOY6HWknwNvMcloWaMrj2nY2mLAl+majzqIF/YBZP5RBLDEIvB36Z\nlxql3Q++6DngLLOJ4XlrIWuITdJd1SodW8I256z5Zp7MH/8IZFefUeRiOLj8\n67OSBYWmMuN4uXewWePPoG/j1Qf7349L7FEEymKQOao8eZ0kRrSYQcJK6dsN\nZA3FH1qIEhElASY8DGjXiJSi2kqizfhAgOz6Xx/KqW64VfpqN35IAPNvwcyC\ntAf1bX8jyh8Rte7hgSykU9wNhZz7T/AJP62T705vDhllb3g6IUN5xnImaftO\n3f92lu8oFUHm6klt1ejYRWTbGnRGIuDyyg+mF3HxkQBTeOhgXM6Nfp33Y8C0\nFUSm\r\n=Ulwp\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"5f23374c7711c4bb456c545481f9f0e296a8f843","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.22.1-canary.3_1624542462365_0.7456085718501928","host":"s3://npm-registry-packages"}},"2.23.0":{"name":"@apollosproject/ui-onboarding","version":"2.23.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.23.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4cbb8a8b27ad5633560aeb631e24ec4194b8eabe","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.23.0.tgz","fileCount":84,"integrity":"sha512-eDWqN8JaitNUQnlTQ6XBT1Em72di+OHuQh6nSiSHRJcmzduOMF8FHm446Ncy3vt9MvdGb4vvNfU18OJ1IpMmig==","signatures":[{"sig":"MEQCIBNFTpIgA9VfeZEhpQoWXJEvBq6zjEnh8aYoIC6mi3E1AiBpekmVBZ3uX1ArbpuhYC+nY/Gpzg+n6w6vFU7NtYG4yQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":723731,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg1MkNCRA9TVsSAnZWagAAtVIP/3EZa+SthABvV6Cpon16\n99XObYCrf92YImKOObS0O/uxh/XJGmRXopmEq2+0vMNli6YuJx7sMdqNhzYh\n18fsG9fQdmJrSjP5Cr3nI3o2Jkl/MKzTbf6oiGJVmE5gy3TVHuP7Lk7qmo/y\nqcfCn3hYW5s0Vm7gitau6vRNmWwsW/L0X0RCb2FWKhF9jbHkf/CJrb34iOpZ\n0GLZLvb1+H6FRVFWP4eK/K433f8KlRok5Ei4g7BSx6wN7rZQ1UqXYzksNNkE\nbtrQsc+aGJX2EORSc2KhaSxmxZPa3tx3Yh/Dz4rIvw5yuYTrKpB01FzGJKJG\nrwKmtxL2gx83YT8oPFo6/V7Jl8bp5LIBmn/lepbMn7bVZXCjO0g9vV3JEV4u\n6GIfoXKFA/uaZzT7+7SvDwAX4eEm0+wLWWY8d63UijxjsGDaEbixBIcVsIw7\nvAvE6julSM+mPylUUhWcXq94I0dTehz+lm8cWuTMG8jcYqx7hvENYgBOUhAV\nMFb9U1Y8eCyVJ7XsFNFb+iE9Gw3e+aKYxZ0+Bj3Jir82GLYvepwBa8F1cF4A\ndE0krScFR/GCUsyjdziiGf5d6OtS8SCh0eHxjvk+VSv0VJYzsi1AXeCrFUBb\ntlpI8KKvulFhSWdAW0503rvVsUyJ+WM4RxhScfflU9BYt3HTF2SraJiRsWkA\nius8\r\n=72Yl\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"de9125d2b9149891aca6804689dbadfef767568e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.23.0_1624557836857_0.8223125406102165","host":"s3://npm-registry-packages"}},"2.23.1":{"name":"@apollosproject/ui-onboarding","version":"2.23.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.23.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"0533f89fbb8f0bea46881eb3f179185cc7348b90","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.23.1.tgz","fileCount":84,"integrity":"sha512-iOFG8Qi3LYFKa+CCnvG51nCX72PF2Oq2pTMzcuu2jdHWSSOj0kFbd+iPNZRZ2H0LpxJEICc0pLMgGDwYMgJeYw==","signatures":[{"sig":"MEQCIEykwnwD+Bxo/7ioUsRpQY5RePa61GypXNRIeHHd7vFSAiAKp44HiyyBSQCGqGp98A5HaiDux/eN5DaX6iArGQPYMQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":723907,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg1NS/CRA9TVsSAnZWagAANNsQAKFM2QDig9fpLvs4BPoI\nSZHcnMNWEZL0pVvKAQeJkaoCKLbM/a/euZoL8IDhs2w2B0An9BOlF1S3Ekuo\n7DFikO4gvLzPaDTEhwpHzq5aYXA188hD3CHJmPfSiHfCwdNd8EiEYl3II58M\nf07WXZki0pMHFl1bxkJvAuC9i6iEkJWo2nr1lwmH5y3lHJer/p+NH1GfIvyG\nPqnWr7X9JdKpawuin6XpNpK6DKV33rG/bQxmsveYRqcuusFzugSUtaLsGla/\nMNErD9s+dGzQmfsHNgjzAEju2dG4ijOHAvXHpsFdFFKA5QjBHwfiuv7b3hB5\n7v88WxBUs1N8sTkF+k3vx3l9J0hoWvvjHlZuzXQ+AjLYVfr41MpX+VvBtosv\nFTnFy5pbZLiL004C6Xl/Zt2xYnon0IeqsuUWUQtxg8DizhT7yoFG7SZd3UIi\n4pBXkVQwoxRoyQWo++lZpMIudGxIBTYJzTp+rir9kc0wiuv3pW7JwBKB1peN\ntg8t4mwY1Y2etamdFrNWPVbPWsevsanm6n/2qzGSYYUL/Xi2nec4k3Rpl9/P\nPS0jxpjVu74oShPcYi5VsxvwcT7xtp6aDTROa7sjpLNK1xRDyG4p8ab53ioz\nUaRsYvLa2LB0gL732yiu0dhcNPI6qwmlFX1ppPk4yXE/GikP1y+xjgpmZ8lP\nGXTF\r\n=NNfk\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"2a603ad82333f4f968585b971e9fa67de2d59726","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.23.1_1624560831481_0.27403575014967885","host":"s3://npm-registry-packages"}},"2.23.2-canary.2":{"name":"@apollosproject/ui-onboarding","version":"2.23.2-canary.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.23.2-canary.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"17d61f107701e9fbc39e4253dc0f152b40ca47d5","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.23.2-canary.2.tgz","fileCount":84,"integrity":"sha512-hCSGBdiYHPj+jZZivrnqjMMCMoq3YHW3vr59HdWOEO/B3l8PAl6P4aQ4mYXDn0zxFZt+C66LEsgTWPhHDdj3aw==","signatures":[{"sig":"MEQCICxABceqJOR8Ayztr16IFGSkf0B3JSBO3ysBe2aZ2PWNAiAt3VEiGIE9d2srGRzLHBxBF036lRLcuPebkdm6j3ZBJg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":724023,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg1hTlCRA9TVsSAnZWagAAZ8gP/jeXRn6BWPzmpWqw4bV3\nPXz0uOHuJ3G9FNewYLAHY9LkTvfX5aG9Qzm1aUKhrteUFy+vEU7BUG4+Dezb\n8KfeBD+4OqLkhKKj06kezaTLqqW6yoZWgBo/f9MabxRWZc/K5JXST7XLewmR\nnwBMJvz/gib+fwoUTu9mQ+hZDmxTjfp0LYjeAFq63XttPZ2rb9Ot46urnOau\nWisgP2M33jPDXY5f+gdHT3PXQJAAuOGE68kUI7mwe6QeIR/HkHQjAy/4z83N\niN8T/CyRhUuXij4GldYttcv9PafZniXx5cGezWgp5qGIq/nrlBdiYppDCYTx\nBa5Kpgrw6KrLsST25v3x8aBD/L0G0b8AQtlS+/9E4k1s0neuf4n0s2qBo2R3\nyhRpqYxYl5IraOCgD7aV5gt3Myza6jHAkjJVSnTqTqbd6uWgcTbCZr0Qo8/X\n4disgABjVlnhiV7blWVhl/Ou3yGYEylYV6NFEM4+67SitqrMTlf1s0/yRQLu\nHV+MXnTrbzXw/e7zg1YX+atbU22ThCuembrwiGjJ/Pz+HepTi5FWe5O5Dvle\nbrF7DTrWk8Rf0vkqYL6HT1ky7w1UiEgmmPbChWYTAMAG4QTcJRLp58d2p/GV\nmeUfA0g/h4WjsU/389792uJYYnEyw9SZbSU+V7f3I909Fi9g2J40Q/a6Vbv8\n55df\r\n=4D5l\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"7e8a9e7a80ce18d96bddda0a9197e59f68dca0ee","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.23.2-canary.2_1624642788852_0.34741251650777727","host":"s3://npm-registry-packages"}},"2.24.0":{"name":"@apollosproject/ui-onboarding","version":"2.24.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.24.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"fcdbaeab1963092c310404728ef2c9233bfb6209","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.24.0.tgz","fileCount":84,"integrity":"sha512-CeOre2Q+xo+pi1cuQILKMSw/lDPCnYXit9moGddmr0AF4WqLokms9ymHefnVUog84e7e/7ImcgZnfcP6VH5h1g==","signatures":[{"sig":"MEUCIGnPyH7tiuwioqH9+lW3qB4vfnmDl13Ug94CSZBB7JReAiEAp5ffBFvJT2sWkX8cviaRJWLj1nkky5Scm8iMjQThRp0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":724354,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg2drfCRA9TVsSAnZWagAAbzMP/i+sG/83oUl4/Wbyir8V\n4huuN8X9owKfJyR5dA2YxsS0vADTY2gDPzgfMF3VvB13ghJZphVhmxuuEEmi\n29myE8u1lTEo6SwKxF4kcn3ADozw7cepbBRCWa9jpJ4liImRUKuLtlwa5BoL\n3rxmP/AXpkeHwwFh07FwwaI9IuHqYB2m65ai26H5NOH7EjGCJ3YBUQg0bs1V\nS2ezHCOlhAd0pzd+Ps5cTDjQWANxoxL0XmuJMKsjjB5qX0ZXUFgxaQXYsgUl\nM+PCeeAzsJqlHqoD2jgTQrH9R0C4aamnorTCCnN4BXBP7bRkAAFhaNlHtId6\nAZSxwLfMqc7UGaWUQdItixkuE4r/nrcO8WOGULpWBmDDw2ZkDkBYWSkmCJuu\np0rlJFB6lka/eJXcFnk4qwFszstTx3zDu/OnkInjQvHDJUzxesm24iuDNP2r\nhKGLPQKEy6rRw6aT9qi2UlZE4i0/B+BQDCFihlkEveIKevadUoh+51yoohvW\nmV5ULAQGf9abgZLzuPzSE+uiNJsINh1aN73O0RiXVzAM6F37ESfozezWc/Vp\njrY3ixqrJu6LA4xWBgMOPYIjl1BrSt7xDIP98uUXpoHA8feGvSMKN61gEi9D\nEpCoYSh60o0X7R133ENCgl+IUU8JgoTa/9iEDEeMdioSydt4oLw0cJSkgvaU\n9VFo\r\n=X1OD\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"750290295526fbfe0a2c6b841233acf7c998c2b6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.24.0_1624890079000_0.8479624141523905","host":"s3://npm-registry-packages"}},"2.24.1-canary.3":{"name":"@apollosproject/ui-onboarding","version":"2.24.1-canary.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.24.1-canary.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"27ac00d1403df07a588ed8ce965a542c01d14f34","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.24.1-canary.3.tgz","fileCount":84,"integrity":"sha512-3qwuCZ2yEzCSXyXqXErIX6sXea1Z+oAcvl3HKw9uftZ48cNo7x1wa5Y5fqViC/1+/cGL+Ac4ZPaF+Nf6ejyXkQ==","signatures":[{"sig":"MEYCIQCCVYa2dH8AQFf7FnCSvV3cplThSjTen3Zp3qd3zqrYkQIhANWDFK03RcAS6wg4eBUJFucUqgPUoiCrQFPLY2gwHO5a","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":724096,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg2zGqCRA9TVsSAnZWagAAR4MQAJJE7FCfaRpKstWEFbJs\nyfRp5/kaqEmM8a4aSSsTo0KLtkYejRcIbztqGZ7g6c2oaYNvCfUUBcs4Bkit\nsJ61V9OmhG9wfcGs0F//duDseAdb3Wq9ECPvha4s1wI31RFX8aUzZ3zKWSeX\nCclW3S/mkpmZJmrQcQ3L6DPGY1WlOszXtWcUiFHIupm75apvTmsZlHssxgOs\nkVseGVVOUWMQ0ZtPK2v6mnA8iFT3Opo0EsFKZJo8zBbyp/kbtm5DpfK0XO29\nEhEqYiF0apihKaZlcXWPzMOoFYdeZUM1EJalTS4+N+h9lS1yduupCKGdNmfB\n4PNrrSN6OmX02+TBkp3AqxxOPM3SmetqmixuaC3n32cfMzd+AC5+Fs8BZ2Fo\nVqN2hhGuizu5mamK9fUNiN5uhPuyB+BsMts7ey02ByjbtX1XtK+DOSbmvNGH\nkQHHPlyCq/GnthuVmxakWPpWo6kZk2WQutTXviAsZEhsqOFCAvX1u01Slq+Y\n0tqFAmrWpCpIBungKH7gMDT1Aok2UpRXrXYsV1/4kDl9Q95nulDYl4HNE495\nRmLvbKHVJ2mtqCTXgoS2SgSaFQhSSD7Ab+N5LTQB8v8vgy+DqYG4eu3aqVod\njGJsXvU9Zif3iInvPXiL9ezm8gMMqERhE3p7I102oAg2YEi0Q/iXAKVlpW7P\nwsut\r\n=4jDs\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"e75d7a74067ed503d2fe899401acb7e59097f970","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.24.1-canary.3_1624977834328_0.7754463485093148","host":"s3://npm-registry-packages"}},"2.24.1-canary.4":{"name":"@apollosproject/ui-onboarding","version":"2.24.1-canary.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.24.1-canary.4","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c599477f3d84459482b3c325342eb92a9d130a5b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.24.1-canary.4.tgz","fileCount":84,"integrity":"sha512-YikSLj6uouMqm8ZxI6XTWzuzkyHwNI5IXED1tHBJ5/T4fzjUZ3cDZlBZ9QPgX2FXVLSh6HVRvZ5b1RI7BjL3cw==","signatures":[{"sig":"MEUCIQCNxDgnQWPSF0LOQJHSLhLqVB7LyVvUyGI4TMkNJRP+awIgOrcNsHLofjvKOVNtqCk2t7FRDc05pY2WQMoFM/3qNRE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":725594,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg201aCRA9TVsSAnZWagAAdfkP/Rk3RdQHPubtJ1ribzEh\nB+mnD+RW3QQYyfLQ70W10YERIIPoNImjMvGgeWbGwXWm8npEkCicXIY/zGL9\nVvVDDvAU5t63CMe3c11O4lcwZIc+uu6NX+bs72eEBYdBVUrSB20Tsg8boPuL\nkfX8TVQ6vvbykim77d8oAtorJK73E6T+ViJqXZI5SoPxb6kqe3yIBlWjR8Dx\nLMcrm1ZEkiNutDO0WceR3Ctlojef/LYLp3UILKCW+0E2ppUkdFwJ/BhfyjnO\nXsCcdegiNz270afIK1Xcm39/WE9FOVPFTdRl4U4zGWePOkJflskFZZoL549C\nh0DJ+2LpDgdWl2DN3HwkzEOKxqrqCeHqy40cmbNVCVpywXql1/OyYZ9YABVd\nQmjw9/21BOXlDEBWtbUrwMwezzkRuE3vGF49AvtUk4OVtmzSjKD83qMBLsF7\nlwnIFmMvtM/HA+YT/jgfdBwf+rlnOrJA3UBG27Fgfa7m1117B8Nz31p8/lgH\n3mMoOSSUBw9vC/lVWDo4MJKA2MKuJe4AOln5873BqokoUW/9V8wBzdmBERJo\nszhgm9xBMd688rKrlN2pfh74t2wIPj+M9mxTATYHlOKDqL0VnYD7xGlswpru\nEdeej9CtqSXqOh5bfd8PoPJvbRnegEKY2Xj3wHQutRqCn2aM65bI4wKJW+Sz\nVx+1\r\n=0LC4\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"1a93cc8364985739720ca53963f26711824683c5","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.24.1-canary.4_1624984921590_0.7805350087583036","host":"s3://npm-registry-packages"}},"2.24.1-canary.6":{"name":"@apollosproject/ui-onboarding","version":"2.24.1-canary.6","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.24.1-canary.6","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"3a77598e670485f07d1f7117ce49553121589373","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.24.1-canary.6.tgz","fileCount":85,"integrity":"sha512-h+uTBZ8K7owk8zcbrJBsF56XrEmO2NoYe08sWM9NAng0zKUBIki0t8neaylNq6xb7UkEIOxlBMwGwrpE5zJPYg==","signatures":[{"sig":"MEUCID2s8KK6VwTShZA2epcR1dEFfXSSX1g9K0Bz//LrA2CtAiEAnV7WtZt7EfGa2qbmWSK5pyFewWH27W+Eej5xLaklIks=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":725716,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg3HP3CRA9TVsSAnZWagAAPCQQAKArGRIyHMsYaHSxpi/Z\nQh8Hlby7gbFYDjr8kHfHbKQbhnDNB8Pe6tIgVYx85BOf3a7JYl7Xs+4ToTT6\nLJavMYAXi9CkaA/CibeP5C/CRGvyOPs1GAMzM6Q2LiiDJxn7Pj0Jo8nRrHWV\n0Fe/JjKRegBAXHccQLWOFZAusvDSGN/6UwIYLhdj3NDcXEqd/yNqZ6OiBj+v\nxCoBziEZ3NVlQmT7tkNVh1Y6sQyN29f4pNr2wkNfQphcs31P4YFbFn7gjZaW\nNflO4fdIJJd9FAGDnOIBqI2Zpwd2dJF/9PxzH7CUFt36+NvJGHzGbJbwEjSO\nXp7zqV7wnvTanZyfwbcD1NBRwZ+jJGB3cbCGXvAjmreGx6GqHyR278J8h24x\nOs826//ChgIk/VHskZYJsA5Cc5Ohy87Vqw2mCggO7rb+bTxzn/O3MzJXoNLI\n+kz58oIuE6CmomDyAOEoyMtHP+v+xD/cw5bfLF1xldsnbTUDkWNv9oUQgNOP\nwgQhXAg2x1VqIuP14ytjYifh2qa3TUs52jTbU+yjNNyfMTrGw+6S0DNmOKlG\nez4BS8VjdGw69NeAbo2mO42Kz2maOQokKOKbwPKx0XsOVjyDR336bRE2Ms7S\nDLkF22QyzaO7d9ihwseruw26RzEx6HpKL8kyEm3j2aYehDpjY9P95tvhqfD9\nrvU4\r\n=/HEi\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"f0ef4f6d5eac1d8df2db217f9f13495ad98ec676","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.24.1-canary.6_1625060343228_0.5966727346470071","host":"s3://npm-registry-packages"}},"2.25.0":{"name":"@apollosproject/ui-onboarding","version":"2.25.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.25.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d2b41f28bb59cc1001045d84766526460251e50f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.25.0.tgz","fileCount":85,"integrity":"sha512-N1dKjmJcWzwwHsRpyJSTeA1NIQ3QmI6ina56OdmMu+HtF4bfCa72/8V+KcwPq0fayPM6Y6WzMSjXFvvGrRqIEg==","signatures":[{"sig":"MEQCIHzMb8VxWXRSyHHsFgxudH/zTbwHJMP5Z1OpBR9QoeGNAiAA5pQe1AUV2AkZgFkvZGdlObYfi2qwRkR4I/TSV8NY1w==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":726508,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg3JsGCRA9TVsSAnZWagAAFQkP+QEYaDmevhPY/OuJefQh\nJ4L1aWwNNFA6agT5tSiW9iyBujs/YihrobfrAeTr3wgbrZg23PXxKfNd0DnB\nwyYZZ/mPRpiub9jBElYfatZOVi880SxYC3xfXjVkUvDlYsXKSKguT6xHqb/+\nJ9SFEzbIu7WFi/lAMWmPfm8xeQPSYYDWgi7sOUTcaoKAAKBSp2yh0fe/aMgW\n9EThoq3SM4l4B0HgvBRZ6DCnxYk11KymnzU9GI9deZKA+GywBwj4aiDGbkme\ndIn7UTDDJoxB6lrP/dAId+RSJQQEpEiqBWXNs/dTUV/LoX1iZ//CegyVnw1C\nLnEiATp68ywVgIUnMIocGB2agUk87foomqcLxBJMTrP+PLnSDoAnzirmRiwQ\nLv9coISVdN30PYzt/6JFFRY0GGnah9v143FMlg3lkb/ppxapwJa24Vol/TAk\n87wEqg6Q67z5a6CSuO75Be0f+LaNqIieMCUiU0eanEnMT/7ENQOo9zvC3TGz\nN4L4kcfJ+0hud25mOp+/mL55KzJHfXQSwqv/55+x44RNVBOULp3ud+Pmlyt/\n2fdW7sL5WRY/P77Io26XM7AMFaAvboBByUOOKnkDAd6reeRf843u63VE1M+d\nYqk5sugDl5C6i9FHF9Ex5MqgjF0pVAatkyjB8JpsZV8YEuhp/J6NpmZBxNCe\nXwOd\r\n=BILM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"ea7f4cc1ed49aa9a58c0a4b5116ee222a9cb4fd7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.6.1","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.25.0_1625070341909_0.38767658189880505","host":"s3://npm-registry-packages"}},"2.25.1-canary.2":{"name":"@apollosproject/ui-onboarding","version":"2.25.1-canary.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.25.1-canary.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5710cd70eda9d0b73d7ea3ac2d3e0e4136933e72","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.25.1-canary.2.tgz","fileCount":85,"integrity":"sha512-u31IrhIxqmvTfNrtFZAXfPXd3c6LZg3203N0+vt2tCjtWF7OPAtX0hfCEQI66azsefmooNmPjDeOCA0Bd0zsCg==","signatures":[{"sig":"MEQCIHbgJN2YvOeZ2pGtw6RUjSKB4W4YRjqzQddXVoYObJTSAiAzHVncaB8pvTbKalhRJGr385h8fDc6U3fvg1MlYknyvw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":724605,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg3PRACRA9TVsSAnZWagAAKT4QAIp1USCU3EkwhLtehIdf\n/kTuFJbIRyasjxbIlkAxwCMDljwGHgYHouVOC7gz6CIMKXEYyHfrkvuOKtcu\nIMSlC1lSc4N+932zwNrlvVmI1jTnHF+Mlo9jAwC9tTHMTb7suaczxEpS3jML\nW3b2WUt+58ACkM0Z0sCofdqIa3BtxdX4/YHLkGgqStldDD7pjjEADAJdQyWY\nve0kf5Dczqhjcoex4qlSUpazTgF6A+9C65qHyNX65ULsUpQXBvmKfbwSFYPv\nVPCe5U+w3VJkxG/aUtsr8DPNNx7ua8q5kN1/VqrQe4CTqTU3ZbWFi/jiSBJ9\n6z76FFJu9ZhTE7x062O8vpTCgQERuXFlBSNr+Yhzk3JQ6QooEvG4Vd3DwFKf\nIpbZ7ZAz0P3f1xXSQsnDnekPwIk85zyR+ZcjfRbVdFr5hn+NI0hCYImVgexH\nP/ml6y6uSkH6PE1pmGQ1tDcxD3JjYUX7e/X5tR2VDUqkNoRhDHZwaJdxpU8X\nXALltXuf50fTnIZQOYRSszEc84b0rksdS8paMYVgxxFUvNPMOU4btQn5Puvj\nTCQ6C4zY/h8f3DS7qa2I812oXGZZZYTD/o9qQ6VkJv96GkJGbwfgzCwfhf+q\n/SkPdMsSlHJPafBsyeWSpc1uP8G9dfFT9/snrIHAfEa8dG0LtRiRfuV3Q2dJ\nKu7A\r\n=jkQC\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"3bc3a0c9bb98514ccb47f9c2d0f3af5da8de1cd2","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.25.1-canary.2_1625093184091_0.7261702884483554","host":"s3://npm-registry-packages"}},"2.26.0":{"name":"@apollosproject/ui-onboarding","version":"2.26.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.26.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d0ca087ed04708cc2632e28eb7602a57bad91d63","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.26.0.tgz","fileCount":85,"integrity":"sha512-VmrF6PWastiRpTutQ/TsEZ6TuBTv83VvGT9Wp7G9fdT3Tg8DsS8BhZg+iwB/9mqQXNUCnItON0kommT8YhyjwA==","signatures":[{"sig":"MEQCICNUSLQ19wKPSqqVIO3buT2elKd0HTvg6WcXvgUILlsbAiBlNWtRa5zDXMgVVMIN6kFPQ2S6giQRoNWPNQFA29mb5Q==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":724928,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg6JHVCRA9TVsSAnZWagAAyRAP/2dx7R0Lwf8+zH1voBNy\nr8fmFCZLJ4KGkYm/NgTljQTH2YmYSySvYcuLndpg1A0V9CMumipUH7W5mzga\nqM3pIuSJMvuL7ymFBv2ik3aB7Gwsa1FDfRSxVn3sYjJZNIRYNpNePuLTHCaO\nB19LNaCawUr+3EURSuwH8toQP/XIN4NM5XEXIy9QfQslIC73cSdPSd9Jc+bo\nfS7vyDXTiXfRA6nMRyrndWKJ8mvuIiEMVDngW4jYakhZLs+hoOKomA6UIivN\nXetHrZWOuA+6ae5sspLStQn/Tl+6TS4HU+OP7GF/tSvaf8ttPZ3UIP7jauHq\nQYpwSX3hP/Jod+egdeqr7KgHDP9+nB0P6UTpEEpsxCtjJAJRV3QXnGp2GeuV\n8jPrhUgj6YmHSm5ToKseEbzje/xX1gdG2z9tMAx3gZZIiSZKU9JRhj74U4u6\niWLt5DECom87+rP+r8foGFDd/zU0Qbm5LBYIRqKy90KQyAZOfiUwhJtdeR/f\nxuEzmvRm+0PdMxItoFnx6cb8MobwzqV1GY6uVcRh+NWBqCG4T6WrGrQZOElI\nT9WBA/7j0FxzIbjC0lxhEhVC7Va51VdQKtdXj9oXbE6EHiooscPJe7Pt/ko7\nd+NF90TFhadeKVigy3XVWemNMzRyZRG3I9CSL3id2lFGPw/HsjNmaSvTA2vN\n43uS\r\n=Aa5O\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"d2fda542fd8141b27075ea03cb637270428310c9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.26.0_1625854420936_0.2799670811413726","host":"s3://npm-registry-packages"}},"2.27.0":{"name":"@apollosproject/ui-onboarding","version":"2.27.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.27.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"78633258dae44f375604b0081a95424fd55ce752","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.27.0.tgz","fileCount":85,"integrity":"sha512-0E3yr9NYOCulp0eg2eZ1eHvUMUZvJhriIU0X4+ZwwZJxSukI5C9XwHJppoCsYuJduDKzplmXDp+pF7Ko22EvDg==","signatures":[{"sig":"MEYCIQCBOviT5mc3CiUVT7RVyola+Wdj+zKX4gkntRwgh264SgIhANNo/r0y8kv2+V0zRHrUD/YpY6xGQe3w+sl8VaQec6+u","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":725103,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg9bJPCRA9TVsSAnZWagAAbvkP/i29Bp9LDM18gc1VWZAW\nUWJ3nyFB7+sCeNzjTj9bmHlwYqzJco2ZE/tFKWVfIoAYjt02ZkaxZ53Y3ffk\nZGb6OeE/kqxUJYwyuNZK/ehoe9GCL4Mb4ArvvgTDvIfVLONKVYfzhl1CWnWU\nS/vDlUswtC2Asly6FtXTQJQtxLrc57/cJKtDgsSsEqFdNyLqf9R23RAh5BE+\nUYG9MJ5LdVe+XrOYRHScxmSN5M5p/zPE+cvUFlIbRTsNQGjtf+emMu7PUFNC\nKTYXQc2hTjEYIujSrY7hR90EQTaqlrXzys5EdrOLRbFF9m7UuichDnRHSdUt\n9B9OMa/mVkbUOHds1G98rbkIc2CjbSKIYEDmcv8hhjfEaiph+Pyd1nPLA05+\nnp3tDY0+uYqmHEf48j2nuHx2Bo6wkyI+CroQFKr/IE+dt+QV9uxsr7MvnpvX\nMHxHyDZnJ6pLuyAxz76gqlWLIGL0TFY2YyIMRTideoDODaxYGVq3GPd022bb\nklVD5r/GRKBiICuMuErF5Rx+FEXtqOZ6RztBBBhS3zzq/Q73krQ9AeuMtljq\nUttr4ltBqaS2pMQy9iZlhJfC4okdE2y8gYv3W88QHiub2KbhhxhKpDAsDgeY\ndcki2m/rjKbkDGkdJg0Da6jKlcLFYHhs/VlJ3/bqOOOkgJiEGw45wg1rlf44\nqpxQ\r\n=h/iD\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"616ccefacbf10c5625d559b564880e55776abe0b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.3","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.27.0_1626714703414_0.498832141667771","host":"s3://npm-registry-packages"}},"2.27.1":{"name":"@apollosproject/ui-onboarding","version":"2.27.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.27.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a6717f5af913678e02a49bfe7a07fa11162d9742","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.27.1.tgz","fileCount":85,"integrity":"sha512-kbDW2jxgnyvCL4cA2OjpYF8DOKaxBilYm1qwYsw61y5bj1o7KwmDoF+mqr5OX2UupvZQjhMSeVZeb+N73Y6ijg==","signatures":[{"sig":"MEYCIQDHxbRUC9ax0lfDiHoXn9t48xDNILWJOW4sIND7b2as2wIhAJnYCVy4J06/FSW3gKaK3mOapa+uLGeW3VTvDcGiaxSl","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":725279,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg9s4qCRA9TVsSAnZWagAAQgAP/2pxhv9m/o8m+QB2O4x2\nheKk/uCzHyepaujjC25jH/HSDTQd23ou/bcsHyuPGjbXoqRea32tvVHPNs8k\nD5Dee3W3tnV51WS91cMclnt9oMyndet4AXm+uS4bQlMDPdRMv6iZ4ln4+qdB\nKNny860dGYsGFO338ioGBI7Q2bLP59OfqZ6SwIRsXIWkJRrTZmwC97Ba3n3Q\ntphGjCjQMeio/q3zRvU+884hglGc/Dr0LMJzGobAv77OzikYhV/L/CdLUx/b\nav7MyZrcrZzt/fFX2tq1UvNkKBo6ybDVK4kkHXdSHMNqpejs4UvPCceRl5pr\ntHIAEzX9/cFvNQ60X5P4HtNHURzZdh9gDDqXcHDf+C5ETgUVAl5tkJ/84jrY\n6k9PwWgGoUrA0KJpgBZeBMmSZWQezkymBW3z35Ufaq+rXAUfmiNwd94dAq21\nx08ckQxbo4QkTUeTUZ+AgAg50xpwCySKR27Wux20OekzUvc/Whq107kLX0Gz\nqSPCX9e/4AQa9MXmOPq4br2VVfJQuC/X3gNtkpCKTJtd8GWCT+rbjXujl7SN\nXa1LHyPZPIinNUvMmknPCX/772J7FXhcfBeOy/3dTnECJZ6OQHRJzpL+0vq4\nt6HQqKv66Pgzph4t1bueyQekJYuc9u4RkxInIEVbKlNrAt9koWZfQjCuIRuT\n0+LF\r\n=duJN\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"b0717da516617733c322d19be561ee402c499b06","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.3","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.27.1_1626787370012_0.1466500593919089","host":"s3://npm-registry-packages"}},"2.27.2":{"name":"@apollosproject/ui-onboarding","version":"2.27.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.27.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9e18b86df61a83eb85a592185b376c3288b4c2c5","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.27.2.tgz","fileCount":85,"integrity":"sha512-Vn40XchmXd0WFB66cdNzvmi7mYtUN7jb7vfxbJJYfqP5pkAedI8ZlMkMu2yYllMj6UabBWY1B4ChFkF+pzLZ0A==","signatures":[{"sig":"MEUCIFK4ohMiT60AzcQiBY6TPJXpRsCe9zz825wOiQ664OrUAiEAtZILH5PKJnsoQdvshyMDbxCNkpUg4eSmJ2SatlAg4FI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":725455,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg9ybnCRA9TVsSAnZWagAALW0QAIqHOIF1iqcvp8r4zI5I\neJJYcKtAFm8xzc80jZyZvNc2MLA3AZl7s+Lc+bE2RCtcTTYo1sbedQdFujvZ\nJ0qCCh9w53dJ3MOtzwqeycVciEoweiUgmAfynmV9h9LpOhvxotgKKCSTcE7p\nmDU+KMYiv5SAc1dYop4EzzqlANyUP9huxAZscWps61VmqanGj7+z7Q4fE2Id\nfZKYK47pQM+12V6Caa9Cp8l9PE+w0Wc4yhSF2D8AlZXi8Lkl04h2pmNyIpRz\n6+gqGIf74HZuR7O69D9UtkSz5rYHu4Im3QCE6mCaazWVD5ba73QUJKGvyYLC\nKzPF9ZUUlkEBE8aCE94vD7Blz4OF+rmz6+4hBHF+rBC05jPR09IWQtETj8+q\nRi6Mb1XZ0WlmvJAAClCUeyxFVY8xujaXCAydTk3RfQ9HK5kWDp9VNr0I0zkf\nS8Mhl8evfw4d43SGtnQ5d8iLVw+jhjN2uAAp2/OxggIMjQU2iMjUPAxXVWiY\n9zr19cxPKCrf+S6RSV0sU2qjZJdNKhjqBz2TCiah7IlDH4jlHDhBC5a2td6J\n/6YvS7lXRlUrlNS1fdtqozHepgUVeGiJqsfI39qjXlCSYTvPZsqUvtrMCfwf\n1aPKnupvPYvixckVCfo8ii1WVyONRg3ziWHlBojd1//l9IrSrzFiK5EYDt9T\noHKP\r\n=hYQs\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"fd9f79cf8876c862cd6a50abba490916fecebc5a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.3","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","graphql-tag":"2.9.2","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.27.2_1626810086872_0.3900327828325525","host":"s3://npm-registry-packages"}},"2.27.3-canary.7":{"name":"@apollosproject/ui-onboarding","version":"2.27.3-canary.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.27.3-canary.7","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4146e7a5bf66d0f4b2575e50ac0cc9f87bf832c1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.27.3-canary.7.tgz","fileCount":85,"integrity":"sha512-Ktnti322r5QPoV6ae8B+50ZoDNDdV/lEPFExH+IrIeqBy7OhzFRlpRjZTyLDJJT1XErRvaK+4CQBs6nSdwZOyw==","signatures":[{"sig":"MEUCIQDYOto/5HbpYPutz3xugd9I+kxocom3vSFT/wxpV9FthgIgNV6+FLMCfmApimR8hi5nTDYuR4Jtaor88Wd69GKH4sE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":725501,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhAHgzCRA9TVsSAnZWagAAbQQP/2deNVH5RNH5OoauvT8O\nWI34GJEt1usWj/2omEz0FAVGEuPehO9uskV63UmNgxuCe9b98Fvq/NWwCW0c\nsmtWXLx/MGxU8HVD0hqJnVEof+QZ4zVtalF9PHmkoqEv4QO/Fqyu9C67ZcqP\nwVmSys6NGRwbXC6lnzxWnFt3cKYCVgVw15f9YyY30KTqKsKxrh43gNyJ8jWW\nGS4jNSB3+H15FOCSo7SgJ5o2+9fW2pGvV5nxxDz/gvuEa73i8ArmnP+P71ij\nwJB6ttIxBnZ7OZdu/Mu1GE02SZlziLmYsdnWrc5OFH8JBic9sVyU1qDvDRuE\n8LYGubFzEuk3eFfgRewQvzceZrARpTfX3G5muU24J490AIJKSj6zrQehvbKl\nz0V1EywifFmcv9N9F0QQuEghMyd6h5eFNVkS+ddRLcOXs86lwelPs+h93qsr\nLRMfJ4gyG+2RWfFBLbXbgC5MzoQNUgGp8XlMViy7K0nk8Rs79ry71DgKhm4G\nVwaydUHxFj0vbCXD0FK3eFJOBPSlS7vgwsUhfRSoUHhI+Ulv/f7nHS0sBdqp\nlsa5yO2yd86TbU6pO5lfASiCz8gFTBMrtw5I+TwnjO9bIY/EoP4Nob2swBqS\nbSMPUSlbjbE/kDsG1ggLj0jBfqHiTjTvJsBzqiP82AKloA02Dn9/s4rgtzKC\naFuh\r\n=T+Al\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"4946de9242b21919af8538c204943ebd5bac8ec5","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.3","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.27.3-canary.7_1627420723342_0.9607037820553608","host":"s3://npm-registry-packages"}},"2.28.0":{"name":"@apollosproject/ui-onboarding","version":"2.28.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.28.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9daad5a27c94b94194fa9066b515b4bcb1c74c51","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.28.0.tgz","fileCount":85,"integrity":"sha512-FZCjyXjumvHR07fp5at3DzB1Yv6FednWrGo+Z0/slWUcILE5xsA2YVDLn45jazYIOPN7eEqA/1Uv7+ZQuyYAoQ==","signatures":[{"sig":"MEUCIQDgA3j1JF79DRA0ZuLYw8Fsv4AglDNcEj2SXF3vP16sIwIgfziV1lib/QRhIHYBVm1h1p4VripFq7E2AfoepfNfoGE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":725828,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhCqmZCRA9TVsSAnZWagAAlN0P/3+gVndaV8QPYqlHsFo9\nh1Yd0csH8mjR71E+VqTRqqB4+2eulgeFmTBNi03PFBvdTtrqiLpbuu6euLo0\n/D9pFf9MWLe7Ta1o3k0Vofh153+BazxsyXMDncZcL2vCyzrbgbgS1nUYpdaA\n4XPFs4/AuMm/REI8NTSYlLZmu0uJqpw34ZjdxWzgQGttY6eV28/QMGlmFy3d\nhr5ZYYO16IwI5rh5hfxn/JBmyu3e024WceTA18ZooQJIEkZy9sDmi8HC8rTh\nsTO4Z0YQehPD+BR+i6lrW5wbPJjRrL+esq1/WcNdNPbqNp+mcoopCd8wJeRl\nCBZn1YGb7B9ANoAID6/OriyUz+Zq9ECWAbhHfHSgR7Cz9jeVFaY5A0aPoODu\nY4IvZsXGtyJk6fLoRAmMx6tJRhZbf2WsWvXCZODoyUQhzynFMddbpIB7hx/f\na+oA+Y02gZWIQa6c0qvKCKeV42Wbi31Dx3AxfQk5cdyS39xkCl8+UTwFFCl3\nKM2PHV1b17y7u/EynYrMYTTDhMa2O7fc9Y3abJ4Sns5UQ25DKM9miTFVA34X\no8FLSQPDZCFs6GFrecrmbwoDpo15oM72Bh2jGw0AHaO7Udcto3hL8lVL8JJv\ni9FexttX666K2sn8WS2XelY8m8Tm2CH9fV9RWvQDc0/p7PzhrktHKrKisZsT\nPm12\r\n=HrCI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=12"},"gitHead":"b4af302d4bb5d8fc2258638ad0d21c7c8bc5da8c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.28.0_1628088729671_0.17373558226379937","host":"s3://npm-registry-packages"}},"2.28.1-canary.0":{"name":"@apollosproject/ui-onboarding","version":"2.28.1-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.28.1-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"8a77918bc7244686025995e40866e6b5a5f5bc1c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.28.1-canary.0.tgz","fileCount":85,"integrity":"sha512-Ca7V0tMb+a1/fv/LtybPHlzTlI6BXq+pmLiGbgdnPUP/9DDkkxohifqrq5OWPumkV2FQeXbj0SMSfnEbUYUH3Q==","signatures":[{"sig":"MEQCIDL6JuvLb/ho5ywjyzvPzWeLj0u9OYCb1/Xfcx68PqW0AiB47jiVp5CBUrAJJRa76lmVloHF7q9Bnqga13Wx9TgX6A==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":725846,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhCqn+CRA9TVsSAnZWagAAirUQAIS/Gv1vHpT4vzEXQaWd\nxQZP0pfzw/FG3YGAF9j65DpICaJm7yWCAPXmxzMcEjo53h2Q/WiZwa5ucdLm\nCbzit6aAnaimcRgWjP4OqOVBP4YWu9RXwaBmF9AwARBXhZ/xJD9njSVYLXCX\n7pLRne8EfWMtERq08giI0wf2E7LyxNd+udjvPS9pEuCC7yFM/gTIqQs8yrl6\nNTeUgVbcqdPZMiW75fO2LhurILRN2pS6Z50+fAEWPfDv+g7rQ51o5nDQ59jP\nCkVDJMmooQJIqwOKP80f63DFbVtwgDWCQLLcuvs0imgXItFl569gn3d/iarA\nMBgGTlunKYbNrJM5O0EZziHA/IuP9ids9Kcm47fQ4fCIqEkuhbtXks8s7sON\nJXbPG31Y19mamxHPrTnxf/PfHPWd0PRFdAEUxcaL//xjYxDW4ojTlAALH/bc\naWdpucRY9QCf15Jmqy1kV5Lp9H7OADDHRb5qY1DBFFTkz8E3faGZtONOFAG+\n03OOXBKj5woi998Qmf4z0Kfl7PYHgj4CPlVoRdvvzYlcrExC21m8ysWX4mq+\nYGIIxYMFLi8dklDPHIMv8LJOIzLIEnIugnl6JdUN3pW4vHzq5FbqSj6DuJEX\n1IxCCItECklSkyH/CjQY6/mNBwayZBKWxayjz1yVPk0fSFin65mKbCsJCNqY\njxzd\r\n=vAbX\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=12"},"gitHead":"b4af302d4bb5d8fc2258638ad0d21c7c8bc5da8c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v12.22.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"12.22.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.28.1-canary.0_1628088830462_0.48293008362403445","host":"s3://npm-registry-packages"}},"2.29.0":{"name":"@apollosproject/ui-onboarding","version":"2.29.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.29.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"e2b381c55208647ab9b721044f8683f4df0011c7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.29.0.tgz","fileCount":85,"integrity":"sha512-Wt0Ow+ODMZrFTBY/pPcLVyyMXUf6+/LTYFO8YcfDfJncGX0iDvxnIvTsVC9Bkx1GSQXLDA/mmhX0bJsTIthC6Q==","signatures":[{"sig":"MEUCIDcsSk+MpQi+lXU4nJazpeV5lYMxxezWlbUUQYZLmEBzAiEAlZ5yIz/qfxqARq+BggXMe3hmrco1Y15jkMVVtnDw7FM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":726150,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhDC6lCRA9TVsSAnZWagAA6O8P/iEwBzb2IqmonzNd5bgA\noDlwMxPK2KEIU5T8fDabpHzqsIUPPPecncCEdTyiBuD/8wu+IAWdB6YyQV5h\ncJWEMl9axGl3JlSG8FoTdAkR7L3y2/O//fE1+9S3EOH1lOjwjDNGzcND1vLj\nSvBZ9djazIthmX97R9KZ05VFJdthk0fiijHj+q2TVI4r6RbVEczZsDB71z4S\nIOaSNdDKeehszWQIeChgOZYz4sheB46AdKNmMwa6w1myfr2n77qokOMNgCQP\nwON7IF/SLeU2ImmCEtxSP2KBF+AQe7Bh1hcZwTYhLy/YnU+eLduiOYqxo2Sl\nPwoMd7rF9ydC0VQMJLd5xSbBd93cnsHM3mehqZ57WPyJUSeTs02AnLtPB6+L\nG8QCcxVwld5qQl3VlbY2+7tt2HRy4Sx/I4wzRV7wfYeSU2IzoOST/Winec+d\n9NDAzE/P2CIQ+LU0Rs4jPA10uDGMiV64eRVllu8dhLZ//dmxEguiaOWlYj2f\nahwbEGZT5ojJ89qhOpcxYh0ajmGb6emxuI7csV33ImRX0BO/i9z96Rwylklp\nX5U/jkJ/GrtZ87WxY3oJFf0vNFTWNi5QUHQY4CTfmafPcwgljZIfNPGkqhQn\nmqtVXLnsksCNBTmAz6vWiXCKFeNfzxG2+Bvr9cYos/+tq5JTreHAo1EbJRWf\n0fd6\r\n=W0BI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"ae40e735efe0280a5cb7f334de3c5e6e87ed2c42","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.29.0_1628188325772_0.5705616966266136","host":"s3://npm-registry-packages"}},"2.29.1-canary.0":{"name":"@apollosproject/ui-onboarding","version":"2.29.1-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.29.1-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"fa0901b3c7e814025a3d9d3ce30fe890ca1adec1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.29.1-canary.0.tgz","fileCount":85,"integrity":"sha512-GpU2rQAA3t2kam8aXghLopb7P5Dd78TDaRAAAUByAIRBKIpFTlXG9qtO+Jeqcj9sH5r8VAQ+GbNJSKhzWtnpfg==","signatures":[{"sig":"MEQCIEmVvKUKUpLn3w32TWE7+i7U2z53r4y9czPpfLkxlDk8AiADHciGM/keYvDRy/AYI8xZ8MVHS2YxDms5DlUTbNLEvg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":726168,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhDC8MCRA9TVsSAnZWagAAZ74P+gLS+mgLVZ1POx0nWALA\nIjbvksJ8qrYSInH6If255l+2HIov0qrjphYLIiPAyWfMH4NOstTNxZHBfQpK\nUsZB/UXU1cP/wfV7aGtbQrCjeAi1wPuDELpn6+A+0SQlm7sxkH9giFZnNYwB\nblNUEHnsRq3Gc6tZQ+eN+kuFNmFAs12OPJsyFwdRykb7bHAFPbaSD6zCUFZ7\n8FbHaGwbdEq9L9QFKzxi2ogUrU/n0VdLvQUDvo3KRbfx0/5eL3XIiisHPrEQ\nFAzLxpFMRn+4uNDGpv9lOWI0Cj6ef+R60zfxv5ly2rTjlfbvBfoFghk1olxc\nD84okQwBKI0V0mrX5tctCTc4waHpcAOzmi8N/g3UkaEGNj/qWhKSShoGkEyg\nmQOdnhQB3lSJsOOm1D2H7Q5IP5/33iNyyMbvEFbFztEScLUu3JUNbftxbH1W\ni3QGX+7iYSggvaZxfF0uIETulKHWmKkGg7gtTYPetwyv1MCz5HJkVPEyl27N\n6xTX9DKbcIg2lgf8dY8ltQcV+ht49tUZfpO8xmJ0KqZdcoT+QplgRP7xTeko\no8Ii/fkUfBvaBDl6ieIN/sWq5qBI5RYOOsesbmIqtINYjbE/H/sUp0i7/g36\nTM+Expyo9dPuf3T32f6fuUuOGiGYuetayomYtZ4VAbkefi3e0p0TXdBWLiR3\n6O1/\r\n=s6yq\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ae40e735efe0280a5cb7f334de3c5e6e87ed2c42","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.29.1-canary.0_1628188428814_0.36427811043158953","host":"s3://npm-registry-packages"}},"2.29.1":{"name":"@apollosproject/ui-onboarding","version":"2.29.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.29.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"16786d33e71a6802e0ea4d7d626ad0f3f87961ee","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.29.1.tgz","fileCount":85,"integrity":"sha512-xo4yE5F8VKbAh+Y2NB7VvVb2tH4woB1JSIbAwYyLzJWHQJRY+TvUcvgkVzgyN/cnEEGYmpAdBX0yFPh770od6Q==","signatures":[{"sig":"MEYCIQC9mocB3bXre4kpLm0CMOCjGzVnaglw4o0He0MYrn/3zAIhAIiX35CNDP3B8P4i6oWDF0ctbGK9KLdBLVYApvfzgFOr","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":726326,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhDURlCRA9TVsSAnZWagAAjKwP/R+gebbofXr0vVtPG57W\n07tmQV+XVU7HSRa1aXgUDwnTeVZz7kaV/S9J3m3jQ8KArOa8C2StPqq5OYGk\nAYTp+vk2NHHxRKHHu+5bVpYjHUX0vM8PNdtcbyLzBRK217G3t0tgT9wHs4I2\n5MH1gG1pEkivnDDwZIIlU4od/v1aEwl9fMe2X0fPuiONrkV7qcn9iueVMimZ\nDcRoMnWT+2Cq5hWLGnsInT5I4RTtuuxrxdwM1lL2YLH59KXb8TTYHUEsYkZv\nycdZY+iRfQ9Bge0dbFvCzwPYZ4P8aInm+TLG9VMBxlREVXV1FQZE92Lh2DtX\nigtKHSpfgGIlJ8UaKdzn51EioIjJXeRQm3G0T0/2XG/L/5JC9syAyHpbFp27\n/J+vFrb8aXqQge0yDtBmLbczk6dND9JY7vg7YrdMoW5u2e6hkDFg8dedGaeU\npSk9iIl0dlbxBnmROAsN1mYJ1jiXvEBAGSS+qnTZddJe3vyY/BMg6TMYYutD\nkI6y1ZunEsbw/mfy+jD0MXU0jEbmFTniozyoXqZTtJpsfsZwii5JdaDtrVCW\nyQDiY3YAnS0h/lWaDIkntHbos8jOYiiURLVlSuW+WMtzWGZsMBJed4eAjGNT\nTwilUBO6TiAl8+LXYcPeFNtT7l1RFz6Ul+m3H+NeSQ9j6QA0ngjVrFzaiupW\navvn\r\n=bM8C\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"14660fe240565142e750f775dcfbc98b767f656a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.29.1_1628259429800_0.5222141073408297","host":"s3://npm-registry-packages"}},"2.29.2-canary.0":{"name":"@apollosproject/ui-onboarding","version":"2.29.2-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.29.2-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"cd780bc2c55070556ff212c3bbf64fab33f37ddf","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.29.2-canary.0.tgz","fileCount":85,"integrity":"sha512-41CruDF6tr8LdBGhdiF8u4HOtd8Whcp3aFeTXv7dxh6rOBDPzLaQjIXYJmwocUjpQiNsHUaWsPuWoiprfPCYWQ==","signatures":[{"sig":"MEQCIFvchAW7+8q3C6YlUHcBN3AuRmzc1RgqtpwAO+pL/D0LAiBfJ7BDXR7Llm4flPRBdL3MDSr2c2tDLhYMk9WAub6CHg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":726344,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhDUTVCRA9TVsSAnZWagAAH50P/j4y02JK+MGIFSVWvdv5\n7g6lI80S/GsYQ3daMfi1X5L9/p1mzRmdi4X0SIF6WFsI0/7GMi4zdTE/O/iz\nJWGxvbYdwSB6nDeLuKyFqbcPh+fac9BavFV0IjImGawqPi0Ngs1yZDMJxi34\nDfzlyNsKfBHp5I0OR6ONAptU7GryzLf3VbpQhmmSvybREj7kDORKAZGfAm5M\navY9ekJXX26rWGWvfiijDefuAvKrhVeOMjteprL8vNhfqOuC4+bj9NIfUif/\niVrBiexKb/9kl2Q/oVvVlpjUSYOSmsPmkX46RnbueLvNo7BSXenFkI+KRKiE\nl1/OEWls/MZ+FyvuZ22p6nMjxxPeShrsS/xLAYl/erCQ1LP5Qki6tsawiKeg\nkUZFeRz1mkN89Qthg7XXfsDwOj/D8Sne4m3bSWj4bMte7gALXvrGYw4MROf4\n4c64su2eLIGN8rFq3Cy/7hjYINMwIcy+Bk0mznpAv/A1zCBBHmMFmAIoe3Ff\nQUUHP1edLKbtr62OvgDF9fkdcucWvjVo1BjmK8Q02jxlzvojDSccSjwK8w11\nU8Q0rJK9d/k7U9OqE25lGIa+JCsa863ekqB5+8NN3Xna5/o4I4cIWhkZt47Z\ncL1x9OrpMtDp98aSKh44Yp8hl0cjqUxHT+hxg25SnmT+KPy7+O5vdfqFHxsK\nRIPa\r\n=J4WM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"14660fe240565142e750f775dcfbc98b767f656a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.29.2-canary.0_1628259540883_0.3144796825432552","host":"s3://npm-registry-packages"}},"2.29.2":{"name":"@apollosproject/ui-onboarding","version":"2.29.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.29.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"118fa92bfa3ed6dbd38e94e4137338d50c209319","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.29.2.tgz","fileCount":85,"integrity":"sha512-ma7qtgMzz7EH5SKZSJf0IHpxoCYMqrOAcHToHf38KLTSuwVsj/j4+T/84jkDGhWjEDDjysz9KvjYbwZ4WwwwDg==","signatures":[{"sig":"MEUCIFhx7ruNieIFmmWGDHmFu//rZbLx9scML1uTSsgD9XiiAiEA/mkK1vDfBSMD4iO+8H8bSzl3OflpYlq1AX6s0NloLNo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":726502,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhDVdkCRA9TVsSAnZWagAA1psP/iE0vdOSNQdVXHpkj3Nr\nx43j+U+C7SRqBFrN3+V1sZc5hVNNPCCVg/PcMDncMAgN2jOJnKQJh7qBTQxo\nJ4Fe8fyagDyvk0YZDacBLWi9eyQUNWQfjTGjwmDYz2/xcMGJHEw12TNVtEGr\nJ3+X5+cuPOsfnGq5cND5SXJr0xoX+byeAWD4Zf+NICW7a7CGJkBW8hA9vIQq\n8dtGNpdr5P5A5sDkkt9zcPP9E3T3C6Ht1oKS3O4Ly7NZOPos/WmrL09xF++o\nFvHP7tGfvaDaLZtMw5qEArqZ8fccHXSXTbaWQ1c5wg73iuzJdQ8Q1DDsStKo\nE8Jrxh6akt6Z2W0S9B7tqsvTH5ac5MraT9f3Rq2TFL9HxjEpncdXgmB2Wzbv\niGRD4DwkWTFt9OhEgC0dFFSTd2kOkrsIjsiGZitmQXrfk8X6dq0EWe5jf4m0\nEp+obTnxQuWJ23fguZ2gyoqUag5qN/8reZDKEI35Vd1Utauznq6mtrSDtezZ\nYgHiE+2DyH81gV6EF8ZYSyafa1f2LkQjVS5YYtCpkVECgIKS/0Uz/midmc2Y\n1YwIy+lKQFXc5TopVjUhXKL41zlEaJUk35bezLeL9Y6fFO2dKzWS4uQRrXe4\nebr7o/mqfiN0a7QO52njvErTDAFZ5/WL0OHX5V7UlPd+asUeN5npuNrNSNpL\nR368\r\n=cOfS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"aaa3a9fd7ad5254cc06aa87475ea348cc3294da8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.29.2_1628264292418_0.7960735318386556","host":"s3://npm-registry-packages"}},"2.29.3-canary.0":{"name":"@apollosproject/ui-onboarding","version":"2.29.3-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.29.3-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6f2d0aa3a394dee7d90a9449554ed82151f51b9a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.29.3-canary.0.tgz","fileCount":85,"integrity":"sha512-eZXFDA8w1SXciHfOlEvwhT1tNCj1NOCO3U2NbnkXgvaQe2qbHh88GqWs6PQW5c/GqlkWtcaKY59l6YMsgmtU3A==","signatures":[{"sig":"MEUCIG8CaQwD6VmCANBnl0kZ4E4zLIDoqejT/7N00/XpS8FWAiEA/9abufE1HWiqq37K3P0ZMYu5ftcAOS2pf0p8diTsoP8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":726520,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhDVfJCRA9TVsSAnZWagAABZIP/RwT92WeCY1nAVLqxwXW\nor5A+m9xJuoxYtCjZIvQK7jN23ZZ4Zy3SF5b2xJaR7Cm53p1hunRudFT9bjA\nFCC0zXXyLiB411peXnDPuafiockRfqmuxnm9ptm5AnvBUA08jVMfs1R/34dD\nnpp9H9K1DX47f4pHg6xl9yj2MdA9Zakyc8jLIgf/eYGjE83BCGD5wfkXp/Y/\nZtChd+GEEr/Y1V1gl5NMGrjHXoSY17jg5EiNM9SfiEE/Vsv6py07poVHepcU\n/qlFnwoBcs+wDtZmgoX0+AICrP66xkzppIAOKoqZZ/6lihMuW4ESzCpmhvce\nAxjFu+DDSnI2nrQVrkdYL1USXAvEvlUtH8fQWPdUGw4OgOvM0zEhjdvbtL89\nXAnDQuplINpzzMTh0XX5cpejrdaf4ta0ExJp6lv0bFoBCtPB8ZmqtTpgiB4n\nXK6xqr8DdHlWkS5fTL+sCIvN439NvdrHUf80UaI7+aKzZggDAWL33DhWS7p/\ntfE3vN1pmvj9AbUdqxfQM7FlB3wEjaNhtE9ARn+wv8/Eslv+O+xrk+6kFm0n\nOO4ekB0iWOvBDs/cCLK/4t7mDpsfTEPgxuO4tj4HuyasflTd+NtkmkwW3blz\nw90uuE5UmYQZcoSWuJSXhqMBTnMRXuGerm+k8hzkNMhn3ZK25YJLJ9mRMCy2\n6Rhx\r\n=MVfP\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"aaa3a9fd7ad5254cc06aa87475ea348cc3294da8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.29.3-canary.0_1628264393044_0.7351825569198398","host":"s3://npm-registry-packages"}},"2.29.3":{"name":"@apollosproject/ui-onboarding","version":"2.29.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.29.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b8a5516c2a92b1ece8b2a6e296d448d51029f2ad","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.29.3.tgz","fileCount":85,"integrity":"sha512-qW5ImRjmu7lC5khLr1Wbur0tNVBsMMCtZYEQz2KVqZX/Koz9ZHFqUYwP2gTU8JPCbP/ziFaLvLWcIu7SqdbN4Q==","signatures":[{"sig":"MEQCIGVrDFnxvK9Z5wE4LsPzRrj/u53tBNE12pOMfrh6TLhaAiBW34eZL1C8xJ0L2ZvEfYZrblg0ml+Dv1AsDKmzAswm8w==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":726678,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhE+QFCRA9TVsSAnZWagAAPncP+waaYl1aczr7N84u6LXJ\nAfmLGyAArpDasCRRK/UF858YpSIYlzXaBi5acyjNZLTjqA3LIjoWGKUoM+G3\nZdTt9g1AZB/cIny+Jq75ZfijclFKQjURPVFvyqaS/xehEuxJxe4uS6DospVR\nPFuLTkqgdSTYUK1qFJlGjwtTEpfOjGUm+ghult1ewLzgGMxOOGG8mzenARhg\nJ2Zxeuc/90AdOer4nbBf21aALIJeMOosiqW+tgPi6vj7hIu9d1cY2Wz03IQv\nEolIM0BtY16d96WmP0C1p0Gl1qAUaJB78kKGfc7ccKpuMnbHQrnRXR1IUMtd\nV2SK0ODCwdI/GwrZpdOYH0gWHIbYKzyqoghiQBNqIxmLrEIXePWVpc7xqvDS\nR0Ao0s1qGtKafRjoV/2tihZMMAaFZAwYLblf15YmS8yiAx3LlBR7JniBvEQx\n0P9sxG/1c0g7ZFd2z3svStpMN2NOqVGoB/EyhyEINhZwB/eDVOij8NR//jO7\nlR9yDP9PXpKnR0ljtl1fGt7aTttcldHppw6JowYHprLAw6rRxNuRffdNJpqh\nInevOubkdJvHDaOwQkZAaSSkUvir4CLvotI9fafOWlkKU9+QIAY0sItXpBU5\n7P7UHXLL9eiIpC6/6P+371ZjI/oXJn3INHEk49yTzD4QaeG0IsnP7xYH+MC9\nv86i\r\n=XRFM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"2cb71a7cead244ac97af58a89e4c82b4ea6f1aec","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.29.3_1628693509714_0.014705629965082734","host":"s3://npm-registry-packages"}},"2.29.4-canary.0":{"name":"@apollosproject/ui-onboarding","version":"2.29.4-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.29.4-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"095d72bdb1f56154e4f0d80890ce3d16419fe75c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.29.4-canary.0.tgz","fileCount":85,"integrity":"sha512-EyeXcu9mcQqP6h7CTDiK0ku8AooO961ZE5e9uLCPmh5tHTGrvBxetmnr9i/Wdc/hpz3wVhUquOAuyeHVuHH1uA==","signatures":[{"sig":"MEQCIAV9oHSkKGFftTLwfuV/AXFakxIMwRQbC4jfBjk2HRixAiACl/JQEGLQYakrTu9mwB2dZkJY+tWEi/9/Y1kXdmrNng==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":726696,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhE+R4CRA9TVsSAnZWagAAq10P/jTa7c42lV5VmkrESk2K\n3SQ0k3EZE4p5SzNh9hpJrEvRnfm1EJ7IV4/d38A6lZVloferwii5eTJc2Ijz\nDfV0We8TaK3khjv2bpeveUlcbirGfcGuHOkfQiugSQQQk2iGSnnar4mWghFq\nNUhoeL4SfNZTZ8gAqOkcGPzxZpYK1Hzn84tg1c0oxC+cZr4CrA732SokkkIS\nQfUF1ChnOkQw/4vJt5mpkG5wo9DdOfwSmiDNFT/X3JbLMvLO0x+kox6X/FLN\nu234QKkP535MZf/sX//J/kb6NC6pK9M+3mg6qtGUeUKuii7lndTiQn2YoAaR\nbn6HuUKhTXPSI6WrPt0x4KxuUWfpHzDMioW1bmAznIQbvMv4VZPBoQrnzaFH\nbCMVt4JAdL9rF3Y64ag2Pxl/VskUx0uMXvyeAyJNkmhenMnSOGxam2SS+9Qy\nPIXM36lOnf0sfnRmJG27ZvFNfDB+o570DMf57ejmbq7fKD976yD6qpJlvPFs\nrw1XeRSHq/XEH4HaufQog5SDPjxMy6xe7gd33MTKH+WKnqC0JtQkrPnOqemA\nYp3wA6oaF9PTCmGDg9++qPVdPFyz68Md1ArWvz42FQDUw4HnSfY2gDmQPPUc\nBJ9lzxp3zAf9I1BkeppHw42Rcop0I3niKJo5f5/90RJV5kUUrxMkLePRJoHD\nCNc4\r\n=JcEq\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"2cb71a7cead244ac97af58a89e4c82b4ea6f1aec","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.29.4-canary.0_1628693624418_0.019444950012607265","host":"s3://npm-registry-packages"}},"2.29.4-canary.5":{"name":"@apollosproject/ui-onboarding","version":"2.29.4-canary.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.29.4-canary.5","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"735d6d620a5288b5bdd07bd42598d65ea2f10838","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.29.4-canary.5.tgz","fileCount":85,"integrity":"sha512-EcMFIEAVa3ukQsNz1FG8FnNTs+PPA7qTcYLX1RAT/97HgQwtRlBNzZLJfGw40MvyYuh4vqFWu9DrcyX4mV2RqQ==","signatures":[{"sig":"MEYCIQCBPzIQX2jq/90XgLKf+mOtRNnjbFuXJLQh6rhYpt63vAIhAM7ej4ISUV8Evd54yzz6XKWS70U+E7GcO4fKFvf1NazD","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":727092,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhFbkUCRA9TVsSAnZWagAAVaYQAKPhBoxAoPlEcRxEIdNb\nO8AeyOldDN13LkBIfe3r+tdn5mT4rtdESI2PMkxp0Sp0kQu1Qr/JU+ZDGhfe\nBDhyznzsPS3g9iuRrRsiNAF5dd2OPBzecBlOjYoom7lza1sOoPLLdWkj8ur8\nX6y7WWw9jYdiuNTdbIJy8/Ci/S+zXNdl6YkC3q9TGrr/QVq7SwWjC5QaVVD7\n4OEo3SmHNUb2BClQH8LXOlunhQrXH478ulNg4vjdhv2U7q9GXYUB6PFU2Ys3\nPniRgqNbEUs18VLs8eGV5rhi/BaYxQY+afLyQUGsG8Ax4RZxTmY6ZoMskn+q\nqzlqKNcZq6X+C5rrz7KSUrZI1nmeNEkiYPZ040roWLAB0K3rUqfwla4Px+SB\nFZ2LtAejqjLcEmwwoqRrYQ2qP6imSnOF6hZUi0KJSYkAPWCSR3Mb9DIK4xNV\npHd3SyynkAHT8K9+/8xZ70zmZUSnSO457hr9b/qbwL/UsRsGfEviKcXd5HPq\nqBvgS8oO1JhTEaZlCoSjx/iVP+9dQdAzuTDoUL4y/kWlGl/0UT7ChT0fJd/g\nu+9F+tFz1bHjYvWreMeMaWhhcb+jzIMAFXU0IzAHvXt8ZDXYNrphEX98VhBv\nkDvCXRTiOAjR7BUz3NbVVrL9Ut4CPHZJbnY/5ceifNdIkyYiFFqU4v85oOyZ\nOj6D\r\n=tcQz\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"4d15b75de207421e1f0bc2aca2c723c61c93654e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.29.4-canary.5_1628813588791_0.18412221720874533","host":"s3://npm-registry-packages"}},"2.30.0":{"name":"@apollosproject/ui-onboarding","version":"2.30.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.30.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9112a2ed83dccea4fa412c5dcca387cb41f9a9ea","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.30.0.tgz","fileCount":85,"integrity":"sha512-o/IGG9plLyc4nOXe4uIcOTluy3XiifmxNlz6bMX2uwtuta1LvgfqFj6hA00nW1NF3sjdQc6eJu3a8xa8C39mSA==","signatures":[{"sig":"MEUCIEseP+g/3yBPho6qeqZWygF+6lK/Ody6CVVKZf9Jj2N7AiEApBjeG3SBg4TdHkT8ePJ7EuLGB2QLDHEWchK1cxnIo28=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":727249,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhG8MtCRA9TVsSAnZWagAAKSoQAJmYWEJIpB09CZnoiVGo\nTsl3SM8IZnyW592UJIyFVbYbgjiAHy8i48hYyp4qV9nyjZSY4lF5WCIp3Upm\nA9BRYQoiZdO0FW6nKQcdjnGUC6BX0kBvLiUTLetYH3mnlfSHQn9XrzNQrpk/\now5d/YIeBIQ/AmYGSajASUEOtqCng4+O0qASwA4Ob3++Q8QCU/8eqRF3e1pd\nZkUSn6dwtZLGXGe6Jt61sP6JuefowX07Eo+lW2REDi52HHfoiogomOZK5KhR\nANjd3shh/+F6+pBEtvYKpeINLXXKHL125p8MqQFNwpsboA0Rn5RNKZ9hM2VC\nEWiOg45PXMrEMh6mSH3rLisoVTxownpvt2aM3dgsFiKFnihXFJe1nkNQVzv0\nIPxrMAr1YEDMvL1iDIjek1Osj4PJk8amVO8dzgmo0zdUdLzFR14fbEt/Hig5\nB8GYx1Vca3CAzwjJUFejyiq8xNz3x3HwSpgN5Iscv2AkfF65TFidB7Xo4XyE\n/S0miCVSqi3XeHa0tq+py/JeyjL+sp7G0afnUWgxII0L2MeraQPnZhUyMfTS\nsK/Lid++agLhbr+sT+o98X46vD5J22F+92wDNc+2aPUa/lKOwDgMe6DD9PjE\n1cGp0gn5z5ENxCbCTRRsMgPOcRRCt4sc5c7Ije1Y3ue7Rb1fg55vfdeKUu2X\ndmVM\r\n=GnJt\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"c5d25f7817b1cfd686beff43a3c31685432a0f03","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.4+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.4","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.30.0_1629209389555_0.43753047912299925","host":"s3://npm-registry-packages"}},"2.31.0":{"name":"@apollosproject/ui-onboarding","version":"2.31.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.31.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b11ed2f0f1be34b720dcd775236f52bf5ba86c2f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.31.0.tgz","fileCount":85,"integrity":"sha512-3DgGd2xMt9eruzBgJEowCrNZWrSqg/uEuPku2Bt+kkOODkM8bcsJYrv+hwEjXwofSRgV+4v6TL4Aw9csAA52JQ==","signatures":[{"sig":"MEUCIDGJ8QliPxLJ83DG03tfnrvjq+R4rLn0zdJdIosj73oWAiEAmJW+UZogoiaGl5HaXwU3Qfgn1ZZXVPtM/Kw0bmnIQfM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":727424,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhJ/TCCRA9TVsSAnZWagAALCMP/iDKC+6milq89m+LI+rs\nCoelNYKYXSkPiwQ5yamhgUy3yka48yyKpik6qPjrqA3a5IsNxKKdlwtUDaFX\neSMVSByr9xLeftz9FkO1Rv4E6gl4eVJL9aZIl5mwqUI78r4SCZ8cxsg+6FAz\n7Jpz6TiiN8P4h4fbApTB0Oa18lpGHdb4ebJxrJWacola9M4O29I4HylAFzxK\nHyso9tNSc4/jRNtiRLgk6MdqSPga7HD7AAA7W+RWUL3l9+K3/d4gMVVzOiLk\n3/iJQilxfrzywd6LT1SNJXPQkSuFm2u0cL4FULnNEtfEQboilasDD1xdR19V\nF2Guai2AteP8gGfL1t8eRr+Bi7wnA4dkYExZxrAVNQll1WH8FvYTCog1FYC+\nXPFeDXPjAOG/XpjlWEwxS5M8+PTWUNr7/2GQag1UEJa2JXnqL9S0e1dOMTLI\nBYM5aLL/NT4YJcTwHwgW5RU0F97l+AZMrbSvhC07Pzm+4n/AS1geZegyFtjI\nV6raOa3eCZXz4S1GauUlCGnafDxFRa9bJEFnbySV7BcamTFd1mIxtMT2sFR2\nGW3sNtzs0TsCvLUPIKkhzWirxs5/MA1gclMnzc9L/KrutV94f+9jFEh0PKhr\n/83DjEZF8QqXStsNyK3g899dNDjq4fV0/X5gWbE3Q2Waun+xIFtciNg2SxDS\ns3Bo\r\n=Iwgl\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"a61693d41db8b7e2fd4c99b50ce653b2834f78c7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.5+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.5","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.31.0_1630008514395_0.8241306721348702","host":"s3://npm-registry-packages"}},"2.32.0":{"name":"@apollosproject/ui-onboarding","version":"2.32.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.32.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5be84a2319518ad86fef1dc16ad1785b7dde7ce2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.32.0.tgz","fileCount":85,"integrity":"sha512-1fi1t5X5WgOTbyuEe6ZYleapcbKNq7r6joW6hWynjE6yy9+r6YBJ360ptUfzH2GlH4iGaV/IIf9RtPWo4IFvQg==","signatures":[{"sig":"MEUCIGnghZFz+n7igGQ9aJGJznQHM9r2poTokOkmrKq2Jyt4AiEAowwC9O2eVFCtdHMlAm8VdX7szKA4K3+JSczTukLspPo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":727599,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhMnc8CRA9TVsSAnZWagAAI6sP/2MddDiGK4B+YuSTaP8U\nBfItGZvRVd1K8FJZX2opqNL7f31Rwl6rGNdwH1nbSaElt3WtXgTJEsf+1xNr\n7b2R+ntHeHmBbHrnzDoK06FFCDWPr9qw72Sd+YrrlFGcPIBf5jDtklkq/vXY\n/HWaD7s9YAl/eD4okeDihikbx90zSBs3EnUw6X/A82d82EWj9nfJ+xLkhA/P\nwfFxaW8uYuSQypk0S2hmdn4skqLuKcDIRDVytgsTpvsInuR5aOsjm1G+pDib\nH5Wx+KshD/W6DvGsUN5EQYQJiGZDw+RNA44v16Poshk160//ZImRtST1COVX\n+ofY/VuX27RJ6adq67/kS4A/aufcBkHmrwVjKeNuAJa7R7bOd3pDKNmEGQB4\nmmPr7jEU7Y7rfqTYqVa+AnkGQM+ftc4q5dv70zfSJzlPeanAtEdXI1H7d629\norDpD/GzmjTg5l44LWZgDUlzIYr2xcd9mxNtMvjfIF6v5io1b7o1UghObsB7\nZQ3l7FtMW3bN1eajlFOLqIQwho73QgXyFKvi9WI2ll9wPufHp1da6c3h8uzL\nFx0M65QfQyNhtoraJw3kRQT43kR3JdzJgn28ywszOrR7BNDsnBW/5Rsrdu/a\nm2K0luQy3HkK4I0YCP81c0bkloleaXXUbeBC4xlinWOAPjS0okuFXXB6pLS0\n0ZHT\r\n=AqXb\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"5efaf22d5397c87381383a6f1fb784ad7bab72ae","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.6+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.6","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.32.0_1630697276022_0.18083045017476906","host":"s3://npm-registry-packages"}},"2.32.1":{"name":"@apollosproject/ui-onboarding","version":"2.32.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.32.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"deae70d5f99b6e243559cd79f499416d12fe3d23","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.32.1.tgz","fileCount":85,"integrity":"sha512-pRlBq3pESmlQooG7qKchZh9JR3rv9MGRE9ISW2jeELc2f3t5nTz+uOdowXXive2DLJI8Ak5t0ddLRQoL+2Lsbg==","signatures":[{"sig":"MEUCIQDJjsm9HrvOeXcrafO1iFU8BNVcQFlFtMj5hW40VZfwCgIgXO0OhRHE8WmkY8+/ysM2AJyYPvcWBv5zgYc3z09xnBg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":727775,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhN4n7CRA9TVsSAnZWagAAi0UP/0NLewq5sDJMZEpcP70T\npBDJ8CmaE7wrJM7k2/9o5RcKkcDjfkQJAT0cM09MW3nkqCtbn39YzrKv28H7\n0vaYhNtMhKsGtN0rNtZ9k2Mr86zfytRFjlH5Z8psVFaxFxECEPYX9+pPUWc6\nYIB2dOLtBWxRWhaJ+8Auy7afyCalknKeKMftbAFjeREVQ8T3HUeVMids2mLh\ntKwSmFkX6eBtSMGS6ZnWtlplGimKPVyEMpYkcLWOt96JUnvwIfPb2qT+xUfS\nJxtjBet5AAsTN0COE6nj9S8qPzBZLKjoxgnuNMpyqCWeVp3bN4kNM2ra8R6d\npnigScI3VkpBwHSZPjhTfKFJeJT3V7rsNo1Aa5bFQEEnvdr9ga3BXq3DKEnU\nJM18c82yLOdfHJi8G3hyN1K5bVYRiuvJCA38O+5r0Ix6GsdwFmTxxG/f97ty\nN30efF2TkHPVW3Me7fMqWg2x4aNom0CuI8HyY9LnkPlUD8sWGzfArRvtXbjY\nOu4fbV5NzGFZjubYFY7RwYIRDRcnU5f3eAYh/ON+FH7XwB/OwrHYO3HZ329e\n+whiDEkYgkWBFc9e7HZtWmqqawTVi6BisRXLp8YG0RGrOKRXqDsiB7E0NxxN\nMRoMflHUCNa8PUWjokLgBdUcOwf2FhhINqX6/ySkavUgtDvjyE1KiwXUjkNq\nRn9c\r\n=UHDd\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"e857f74c46ca80b0f89960c7f1eb2e7d5bae10ce","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.6+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.6","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.32.1_1631029755299_0.7874917899527607","host":"s3://npm-registry-packages"}},"2.32.2":{"name":"@apollosproject/ui-onboarding","version":"2.32.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.32.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"8c89d84d3c87470c42efbd006190f410975bc6f5","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.32.2.tgz","fileCount":85,"integrity":"sha512-bnMnNm4Jor01UD31v19bNWp8EHVtm4dpxKUQTHyKTNwq3/7wBvboX82eNfxzP5KUPxeaSRiGfivYjTobFUK40w==","signatures":[{"sig":"MEUCIQDlCIefjCfT5+D8dYq/PV2wyyFDg3bFcYqrZm/41k0pdwIgGKIyZ9mqksYEaDinq4fROnpkaGCkku0kpYeEo93tkRk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":727951,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhOkd+CRA9TVsSAnZWagAAqhQQAIU9vJmrdvh8lg2jWGY3\nzz2dtzcfl3uDs3itxGfy59KgA2Xjo/95MuX4Dla+anAy5eOPUQKphlC5a10m\nETKH6TxSM1Yn2OwUyg920kvN1h7gK1zejdv1RBlFSmY8YSWtoq2aN0vxPkTf\ngwY9a+JD3ZeDOhu2a8v6xmJke64HhTBOaXyOapLn/YfDolUSyM6Jz1P3UnIE\nxtQIZi67MMcloRf9P5mGJHwWPDhhFkJQpMt8eDsLIRMnRS+oIsDuP1ppJt7e\nKXyPibfaX7Ncg2h8jTGg9obJA/es7dQXgWlbzOSsdZ26fprCfCIo0u93ScHC\nSra9htx9LZHN41soMjOIsP0ND2c3ivPkZR52xkiwUpig6k7cPWtGUM7jAs4v\ngn2sMuMn9jYcYwA4YPLKSa0EB1T5GtHC5342CaygKuUwqCpHnMHDNe9HjcLO\ngjwsghxroItLIDyqHewt+pgUbNtNeCwYouzJ59HZxTBJ+iEMCT1ytS/vBVw2\nHadLIj10vub1lZCd6r5PHvbD6OX/nsLvykBMZRVWFk6rQ8TGdI2znV9ffgt3\nhVjcbP5PVDhzKo7982VvyN9Klxc1naO7/wZQBvXCzQY1nlmP76boKuewml8O\nSel/X3i0qpd4Gpti8eqW8mMz6WgyiASc9T+bVth9IU85KfX6A1xBP/b2T5kA\nSbpB\r\n=INxf\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"d4d982e8c7eb6214ff272af679eaa96e6752ba3c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.6+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.6","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.32.2_1631209342239_0.1153807865184282","host":"s3://npm-registry-packages"}},"2.33.0":{"name":"@apollosproject/ui-onboarding","version":"2.33.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.33.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7267aeaffb26d2cd80e6a626c598f05ae8ad9898","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.33.0.tgz","fileCount":85,"integrity":"sha512-1Uty7WRA0jw0KkJDiCu8TKdo1HAV0ziC+6zBb0/neJCwdz2qvMLmDi9ckg/3UfFZ2OaASEtUyV1DiqKm+zQEXQ==","signatures":[{"sig":"MEYCIQCtQ5DBpOl3V75O7IjCOj9wXxxFNGIYBFdDMk0ds5KC8AIhAJ7gh/cry1fYsyZ1Brif7fDyW9yvS+CYnOXWdvzSSMEZ","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":728126,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhQhHxCRA9TVsSAnZWagAAUC8P/i9UMl8pP4UOqhWb+Ejw\nQw0jU3ylSsYUTVgf0L41Z0KdBT2zRnF9bzOB1dcfU9KndOhNNYgk4wsk5tV+\n1XVe9Vq9nurnnN4pp0TP5mvoEXnAte4QxKOqcog3pZdhY42kWjRYAoW56xn1\nI3/nhOM6YnzypDyG0z9PrsqAxpAtQqXDOq9ls4rsEjcd+qAZKWZ1RHuJJZ0o\nlMfp2ZLE9oRV4G5bTe4haZnUeSuQwWvpN6fs7oRxX6gLbgbIE6jcg2US3ow1\nZYuCydagZXlCubi9Xl7Ew7yCDcmzQkthRmtDIPzREadC7ymj3wNasKoGHbGm\nuTO0SbCAl8sV2TtulJIMXdXg0By1GR5BxglhW6nj+bnuyM/TRCExF6KDU/AS\nWKVqvj0FZWBuCm/OhFn8+sc1pVaFf4TgsAwJZLFIsChq7aVFqqrW3od5Kax6\nPrUNEiND74qlOL668Z1WpqOv9prxUgdL7w14F27N+CSXoaPhTGqKotLjeqPa\nzIljLealk/zD62YLhWQ9yIduFsI6ncBqrvg6VDDADduqmFMWFsOTGLuEGvle\n9VPTqkEqGgUk5Rv095ad1FtaOp4pksbSflBwTH3lVMHdNmMg/EJROZ0TUOsN\nWMpOG53u60M+umh5T6h+3COIylOr7hYwkChrbTgqnJMcd+o6Yg/Sg0MFWRxt\n34z8\r\n=Ofoa\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"629a36db75775233509a93734fef8f85ed23701c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.6+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.6","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.33.0_1631719921413_0.33573251134901705","host":"s3://npm-registry-packages"}},"2.33.1":{"name":"@apollosproject/ui-onboarding","version":"2.33.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.33.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"fd3f3ff67eddd3914b98bd9ef867f2adbacfc376","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.33.1.tgz","fileCount":85,"integrity":"sha512-5YrMSCAKmy1iWFaMSqiXceh8U5bo2mjWM7WpHnfsAJ7ScTFAQfQWyN+CEo9Nneh9AitxzQr8CfsshMcGE1MThA==","signatures":[{"sig":"MEYCIQD9eCemE7N/f8XlyBpjsBXLkI6QKmgjGnc4Qzff8pilDgIhALa4yEz7KxuYmY3ypazrrRIR7tnxZ1vKDCN3Q/wYTGX5","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":728302,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhQmTBCRA9TVsSAnZWagAADegQAIJU/mAugT6hnaOw4RUW\n4DAWmj6VzI6Lrb9y0Zpzux6qhIdiTOGXWM1H12tURnnjXBGxbAlEkhkHYtjt\nk7LXhUVjLwKo9IBD2jbwyLnov434vh+1hjs6TInfQzSJCnM429hdBiBdE7NV\nxEsXm73+H4mqXjspxH1Z2Aa+97gHCFNbXO9bJ0vS7buKz3z2QMcRnKjTR4J9\n06mQti2ys1x3dJguarzwDtGK0jljr1Oh4PcBSQvTYYOld7zbD1n+xKVPI+MM\nMvYq4Z7fo+2xLS3ANoFVN2LYqUdxJM3wvphwALSxImVOHfyCI9+HflP0j4QA\nKuvtvPfgmF03JoiOYKRU9c9QClgsI7gdFpQKY7+nfVYMmwuF5pIr0ZwyOXp3\nYatYf1j3K3Kq4q/x6tBmNiNbDCvWm6FHoniOt03KNHF9cTfFziEFBpneV/WO\nf7nE/CgIfuLzb/k3c3hztPH+CV0GKankZNoBzxm/D3NdMnoP/6O2JIjSYXho\n7BSq/VdR79MIZ0ORIQORbasI8JIb59v81l6ZrciPAdiV0BTrpKT75yyLyu7j\nnnUXxuqVtXZ/h9moGNZp4SIjFlsroV0w9QjonOSWN0y8Sb39yEYKAsuk/JVE\ncMmGB8Wwzky0kaJBZ+t8eS2YdJObJabD+VIrQU4LakeP72z/yuOY1DrGcbt0\nrUNI\r\n=CbXI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"3ec8a8cabefdc7e2b1bcea784bad9c7161699b08","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.6+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.6","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.33.1_1631741120906_0.9864162216078785","host":"s3://npm-registry-packages"}},"2.33.2":{"name":"@apollosproject/ui-onboarding","version":"2.33.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.33.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a37a4800d04d525119413cf06715018d7ef0a444","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.33.2.tgz","fileCount":85,"integrity":"sha512-ExhTHgO1HUkqQ+q+U4TJmIG/OPx3tNzsHhA6DnMAJ7X+/oBZmNftpziCSlhTrrMnAk738NJJO0f/Ji/gh2pH5Q==","signatures":[{"sig":"MEYCIQCeiABJGwoQgSv9ANxz0X633gU51olmo/CzzLWIUV7LHwIhAMoDxF5B57Z7Fn8sVcjkVbuAaetwcBi07cWCMaU2IN+f","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":728478},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"20f3dfd8c65dda50c1e1901fc7df9011a5193845","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.6+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.6","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.33.2_1631900564412_0.3151811191832423","host":"s3://npm-registry-packages"}},"2.33.3":{"name":"@apollosproject/ui-onboarding","version":"2.33.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.33.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"f393fa43f64c9bf4c40a1af2693fa030c13bb974","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.33.3.tgz","fileCount":85,"integrity":"sha512-Pn6r0ZtWL5D5YITuIOevPPwLbdD2onGiXqoJsIyAnwW4zKUpJWQJ4OO2TWXkQYFyG1WtMhF20y9wxcfH8KBU+Q==","signatures":[{"sig":"MEUCIQCmQTIYGXuuHKhugBu4FiWTu86tMDGfHpq4VCHKMykd9gIgaopXNL54vrgE6pG1c4E7J8OVGvNJwccHuekcOn2dxV0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":728654},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"335fe272894f011dfa695e6c3d233b7c8f0139e9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.6+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.6","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.33.3_1632321104491_0.6727581445769946","host":"s3://npm-registry-packages"}},"2.33.4":{"name":"@apollosproject/ui-onboarding","version":"2.33.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.33.4","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c9c8f188f0b5f2366d0a0df096567b080fb0c11e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.33.4.tgz","fileCount":85,"integrity":"sha512-eZEhSaXK+d9ra/sbKElWZdVKQGmJDfPW40p55GOJ8JWPDn47SWj/gOVS8Ic+HyJR2zo4kHuNlePRAFg47q0mfg==","signatures":[{"sig":"MEQCIEqOwmDMTBfGHcgd9fppYnqRzjWLK8TdKKSfOdTztEfJAiBVpo9Q5g4Bid1+oCAGRfZOuNti0uNkydyXkJiXKGNtHA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":728830},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"4834d95a80bc78986593c593c707ad45213e6c1a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.17.6+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.17.6","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.33.4_1632749877503_0.20988637168609237","host":"s3://npm-registry-packages"}},"2.34.0":{"name":"@apollosproject/ui-onboarding","version":"2.34.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.34.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5f33161dd1c6e398c9e1bf10b4859844e1da495f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.34.0.tgz","fileCount":85,"integrity":"sha512-2fbpDs0q/vEG/vyjxUVIeyJa7F8ainjeinTRkULmRJ18k1EME7x7FCDSZ4wz89WwNqkCkUX3igf2OMlddw8yoQ==","signatures":[{"sig":"MEUCIQDdvR7/3HUsKMHamba4CBZ7XnC4BfFEMlL9mdK3SzNJBgIgTU36tv1dG7OKpdFjLZ/qyX0svk5fRcyWktP8G8U36Ew=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":729005},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"d9cb459ca58e1443bd1a609cc9900cec1ed738fb","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.34.0_1633113388542_0.3236849218234277","host":"s3://npm-registry-packages"}},"2.34.1-canary.4":{"name":"@apollosproject/ui-onboarding","version":"2.34.1-canary.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.34.1-canary.4","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"e9aaa35339efc0d64d5648f967a8a8c87daed17a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.34.1-canary.4.tgz","fileCount":85,"integrity":"sha512-IvQmBwPBR1fj9mIZtqIF0QRw3CYLYCXBYHT64M8ddhjWpSnYO0LD/+QR2JA2cv8SH4n81+7H6cN9EJ12MVHnhg==","signatures":[{"sig":"MEUCIQDVffN4+M6RiHpCCA/AxMs5S+0aMN2qqjv2o0LYHvWtgAIgKzDgjtENZarC/YKLHsTY+uHQu02Tfr9Jx8goYAOqpdQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":729478},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"98ed431b69ac7355b8a0d047a2384a02fa52f5df","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.34.1-canary.4_1633722631619_0.8711508263447394","host":"s3://npm-registry-packages"}},"2.35.0":{"name":"@apollosproject/ui-onboarding","version":"2.35.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.35.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b84cd7b7daea37a6103e8d330674776acecdcef6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.35.0.tgz","fileCount":85,"integrity":"sha512-d6YU+X1xbB9GyAvcOax5dbl9SnwvZmH6zwTWIG30eYihsRYsEG/8pHyyL/Oj5EET5PcF31M1y+gthAvBEDO8bQ==","signatures":[{"sig":"MEQCIEc/gmuE1vjfRZ+6zUflFhXGM+5ermBR0VAjdSSM+4Q7AiA14YSeRoVWvfkcjhGfwIqWdhfh3f5aSUg01G2btodXWQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":729782},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"83a56a48dd28ff2a518947d293d3b763616cb4ad","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.35.0_1634046041719_0.39826451569498444","host":"s3://npm-registry-packages"}},"2.35.1-canary.1":{"name":"@apollosproject/ui-onboarding","version":"2.35.1-canary.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.35.1-canary.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1b0b077806bfa7c77d1e24e381906207aff8764d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.35.1-canary.1.tgz","fileCount":88,"integrity":"sha512-fQTv6ebl49UFkim03Z6VOOuzknND8pZfWH9Nr4LFrtM0iZMZMkGAtkyMeYZzV/dzuEo9Y3CsmXAJxIC/IaWB1g==","signatures":[{"sig":"MEQCIDskprAlpp9AiBwYE58VCySSj/RnwfEdncHdfXmEgCGeAiAzMzx7gnDN8SX6UHuYwqqZtD79BUZD8rIdZRaE+oDEVw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":734463},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"e1173c9fad5f47ab6aa823413f4ec7c6b2d65334","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.0-rc.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.35.1-canary.1_1634165125842_0.3467778164209956","host":"s3://npm-registry-packages"}},"2.35.1-canary.3":{"name":"@apollosproject/ui-onboarding","version":"2.35.1-canary.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.35.1-canary.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"f120aefcf8f413791ea0c34507131754daf12232","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.35.1-canary.3.tgz","fileCount":88,"integrity":"sha512-EY6AwcIA2TJVUr83qASzQdCdd6G+bcOShbqn2LAwAz7XD4XBiL+qeWSlxddoQiJbNJI9Z+HBjOsWq/a2uxYvqQ==","signatures":[{"sig":"MEYCIQDrZof+cBKCbFarVAq3H76Ddj9rr+i+JgP2gMUMocAHwwIhAOc0jC35s7rYiCN48L8l4Lped1HnRtaunYLM/PDQdNhO","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":734459},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"6411c97ff0467ca5cd458af8697b1ab2557c7c4c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.35.1-canary.3_1634335062719_0.9850499152523322","host":"s3://npm-registry-packages"}},"2.36.0":{"name":"@apollosproject/ui-onboarding","version":"2.36.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.36.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"71b8591ad4dbd2724157bf154d0d3e14a8c984b7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.36.0.tgz","fileCount":88,"integrity":"sha512-A1s4E/dVYnBxZog7qNhaLWEcjfkSGS3Aq504E6kgHAStBGNmKYMbrp9bgIfTuVVTPY2mxp2yL77qmNxMDroygw==","signatures":[{"sig":"MEUCIQCVZFFtVxzIhEGWkb8UskRm7BCQxERA+bcnnsaNQXq0rwIgRcG68jumDUsdHb739YJJ+MeH3Ayjzgru2peTIp6v1Hg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":734754},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"df9ec6d30485eb3849f63a52cbb3a378722257e7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.36.0_1634848312381_0.2540421952454721","host":"s3://npm-registry-packages"}},"2.36.1":{"name":"@apollosproject/ui-onboarding","version":"2.36.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.36.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7d6fdd9026016071225a868d365a092821b08dc2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.36.1.tgz","fileCount":88,"integrity":"sha512-nMXEZ+NLXN3FeEIk6Q4hEHYbiNbHSJUgk45yOkG7YOE04PIkC4TQEoPGkOk/XCLJoK3FBdbzeuybkFxEzzVd/g==","signatures":[{"sig":"MEYCIQCPNTCYr8i4zbpFjO2AVMGy7HEIb1VBMD9/X9bEWxPjCQIhANO1aBPIWhodIqBaMRyWiyvCETpbGiffq2iRx5VQTX9d","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":734930},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"b7658365c67e3ad42f4aa53497bbe3e4b5fc07f5","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.36.1_1634936570472_0.7603585985801558","host":"s3://npm-registry-packages"}},"2.36.2-canary.1":{"name":"@apollosproject/ui-onboarding","version":"2.36.2-canary.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.36.2-canary.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"e93da0ad21abc57fd7141cf0013fad3989ef8f3c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.36.2-canary.1.tgz","fileCount":87,"integrity":"sha512-Fs81EmX2+NY+yS92mHVFDJ5T3fsMQFg8L1QC3hmjnmT8zhm79gkAPWpe0Bi2NCQ8v/eciqGERVP7n7V/bWDB8g==","signatures":[{"sig":"MEQCICyeke5Ez3y3/QePGxnmg1FOrYwt2kFTGtEmOKShpxqiAiA0PRO4bY8J+NQUDwaEHSK/fi4w/Js6WW0Gmd7Y9MLXZA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":734599},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"03d78bf6171459028d19f6bd58f2bf987f9e4ab6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.36.2-canary.1_1635203983788_0.10954440701235124","host":"s3://npm-registry-packages"}},"2.36.2":{"name":"@apollosproject/ui-onboarding","version":"2.36.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.36.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1bfd91a667ac6efbe28842ee8cc5eb497ac4d604","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.36.2.tgz","fileCount":87,"integrity":"sha512-Eg3diqk9Qfml5YMT4WCqaurYaptEbNHB+TsrGQaa18LkO+mfC1Q7ErZRM5e3kQmgoq6rLGwCYvuYlJREbSQaxA==","signatures":[{"sig":"MEUCIH/481kHKSkCT1wDp8kT2vKh2ScYlIww/L2PR8s3Jc0dAiEAmccjz3e+S3qmQgWfPsuGLFT0IfGxOVQ+zg1cnbifjRo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":734757},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"a35329246cfb0b03a5704d5cb0f743048e23cecc","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.36.2_1635382147422_0.6452127675810311","host":"s3://npm-registry-packages"}},"2.36.3":{"name":"@apollosproject/ui-onboarding","version":"2.36.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.36.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"70b1c888340449b0eeb58728b445278ea8106c90","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.36.3.tgz","fileCount":87,"integrity":"sha512-5PD4DZ7QFQPYa7ksJSwIvZvESr75YC4g8uVv3/Ex6TK/fHaxS3RRZbJI5tgW6woTGAjel91/TQVYuhRb/RQGLA==","signatures":[{"sig":"MEUCIQDBOA0XDee8C3bNi/QshHx6G5fW9/0Rs1Ll3v+ptLBySwIgegb6lKs7Vs449jG286jrXifJPy/Fuysr3m5PbnyVan0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":734933},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"a8e2c47c65cd1aec8ce859720fa29c1e31cf4d5f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.36.3_1635514587953_0.5051976794526472","host":"s3://npm-registry-packages"}},"2.36.4-canary.3":{"name":"@apollosproject/ui-onboarding","version":"2.36.4-canary.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.36.4-canary.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"3a42383e5415c6e6e9399b14c64cfecf40d59c41","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.36.4-canary.3.tgz","fileCount":87,"integrity":"sha512-5JDQrRJCKGD1fhL7HObcHvrup9cbcYNofCvZpgSfMBlCxxZNNHmuY/isIx9IHBQARvEnYwJaILzWgiWPCibGYA==","signatures":[{"sig":"MEUCIF1yG9h96WNtg4YfNMCgIyLsXbo2MI3fp8msI81B9zXMAiEAqeN7bbCv7VZcw1pyTK8/fkZo9ikngWFCxIqNHOryz90=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":735044},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"fa0a2d9dfcbb79f75911ead7dce99fe854333e4d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.36.4-canary.3_1636737077129_0.5813330563986125","host":"s3://npm-registry-packages"}},"2.37.0":{"name":"@apollosproject/ui-onboarding","version":"2.37.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.37.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"12cb12967089cb79bcd0bf94a886077db07c98fa","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.37.0.tgz","fileCount":87,"integrity":"sha512-sh562a8PVSO8QpEDPsKLBeo1z5ND1DJ7scOVocaKpZCHr+1uB30bjOG6GmltSsrvpNyfclIimpX8eDWe+phFjg==","signatures":[{"sig":"MEYCIQCVpOSfqEVEovrO7UyAIHcokBDm0J3qDgrzxfx0l4bZtgIhAI59mvIv/+3bI+q1/UBEV7xIuv6QtImryg9E0VW1Zxwh","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":735379},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"19824a4935ded21c9623390e91ca308f2ce4c18a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.37.0_1636737633249_0.7874930221425795","host":"s3://npm-registry-packages"}},"2.37.1-canary.3":{"name":"@apollosproject/ui-onboarding","version":"2.37.1-canary.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.37.1-canary.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"721fbd91d4f4287e07e56c5ff785b0f73d1bc97a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.37.1-canary.3.tgz","fileCount":87,"integrity":"sha512-WLaiWia+CX8K44nMKNnYtczjdriXbICMY14ZH6gdOmz3mz8e3Ur3m19I/a0gympCyVn4mwQJtWIUxpt3MitOYA==","signatures":[{"sig":"MEYCIQDleyjezBdoLTwZV2Nzpo7wANa2R9eZeUcwrX8B4eMgRAIhAI8qe4J2eQt4XSNX2RrDiiTs3hhgGr7QJ+reVu+0D6/j","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":841402},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"1c44f3def01f67ef7fc7581d4a731797be29b998","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.37.1-canary.3_1636988574318_0.22677096434588528","host":"s3://npm-registry-packages"}},"2.38.0":{"name":"@apollosproject/ui-onboarding","version":"2.38.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.38.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"394ce001e0ef2fe87a685ce57ffc9487a64a7da4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.38.0.tgz","fileCount":87,"integrity":"sha512-8XtBkakjNsqrBYI1pAbBasXgh0EX9E+vPRZ5C1VPne+91V8TEkgneRfO5ws4D4rWpG++WgLi2GnDiLAN3fi3/g==","signatures":[{"sig":"MEUCIQChVFY4CBW7h57DfhMpc/QOTY5vvmo2MIainCd+xvkxjgIgFBtLKdBNVEOO0taW8fBXTvor1hXvJAdbra3AaomaiA4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":841559,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhkpBTCRA9TVsSAnZWagAAUiwP/Rcx2jrxLrbQ5Sz62npe\n+ps5KJHBGe3ORcFd/nemrPq+//iQ7p3Bn/RWFsslC9yDWUQbnnc/fkPv4QLz\n0NsCCcP0BNhc2fwW7LN2RnVv5C4GZUywABzV4ISohnepmT9dNb5bvPICXdzQ\n6za+MkpwX3O5XHFlNDazGeoGtj6x8rn5+f3mvvRtUGKo0U1/h/PeLrlhyV63\nWiqchFIHp4OzbXwSrW/gpwEzxzpE2YQVhAe0iBr4k0bQ5RAFGyjvT/Vzasgg\n7Qc8X6R5iYmBAL7xzViMGT9pliETJtFZ653/oIranJAi126tkteLPGW/tFMV\nsNdqkNCaVGFy5TmVBLiUIwphAPogA0t94JqasCutQzGdiS7hjtFaNluhLuDL\nK5ZZfgq/hBfj/kRkzwibH07S6Mz30QQxKDKlhgmdrX01ucNVdYImHckcj2nu\n+LLvpK6kaZyXhLq+AOX+l3eMVUg1KW/rs1fiYhsFHY872JSipeln5Nj0Vg0j\npT9yRtpXNJmmEa5fYYH6f5GvJrIMAKw02Y6fis8i7JZiJaJan8xquznlZ8S2\nPAzVJukYbmhaCpqH8WEpGOafAct/4kx04qKnzz514/DXaOBfcm3FmD18i0tn\ny+mDszGgDqQ1B4Mh0ISdR9t6zlp0No8DbgYQs5+Ghu9oZxKQSbImH68cyJrD\n+Qjw\r\n=CkVY\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"e7821501be31b2501bafcc66f9910a43afb6f941","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.38.0_1636995155335_0.6799637084854462","host":"s3://npm-registry-packages"}},"2.39.0":{"name":"@apollosproject/ui-onboarding","version":"2.39.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.39.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"82eaf9f69a916e30018ce0b3bb6e254c778a1969","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.39.0.tgz","fileCount":87,"integrity":"sha512-9e/vPTndEHnwdzSsbVbMpotHt+GgJNmXcSlSCZLyidT57jtcT+z6dyQVvUe33MfxIH1JcJM+iwWT0TxJi/bgFw==","signatures":[{"sig":"MEUCIQCry8rjsGlsNNjxC73CNvgMfdJh4NygCRQgG+c3Iekv+gIgShN9fs6x5q/LZ8xRtw1Nnvr/fgckopVSqIh7UgAjJkg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":841734,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhm/JmCRA9TVsSAnZWagAAYsIQAItqGs7QDo+721Gz7M9Q\nJfCm9sPB9UzMS1BAa2T23JIkQ33wyMK2yA/h6c4gQkZHuGLpLeOUUb9CDEeW\n0dx+2/Z/AbACqCw6GbOJjhE1RaeNvCQm2L0cOC2B+xXrvrmOGofpSWl1Z2F3\nQIz/Cso6pyJMbpll+rYY9YBHDag73svY+iW4aYnwf5QFgYIfXDvfEQWmNtJE\nx571vsJPcYf9Do/tX5e2nkbwlnlZ3/zXVnkNXw2T9WDki0wiMBW8AHBXw/RS\nzSCAy86LI49ApeXwgY5tVD4TlKkWjrAM2sQQ4eCRAK4cI14DiL3+cyL3NO+G\nVxxD6H7cCv3goipRjXtkI9khOP9Hy27WYDSNJb6r1aTBfsjHAlYqlmSFRLX5\nAVsizHsMsO4KC0FwLXfcw3yk+mDdpN5+BSXU8uRkQPp/CjdDrcFF9KhdbZTf\nW4q0Xvw+/rkhL0u6hiaz8BLavf4K5jpKJx4MmFD16p28En5u1j3oOISz5K0d\n0LXi4FULPOQdMVA3Y3UY7PvM5up035gXHF3Sx5/+nAt2lxQEKHZsiSWzslt9\nYBpLnNjUkMueX5GnwxaLz5XWnuvUaWB4YfAjnzgojIRv++yXKVqpNx5DR5fL\nYkhG1vdeOilX4K8cxt51+YTEy211GNClVhiiw7o1aoveoxhAc7yax4HQr+1E\nUZ5m\r\n=c6tZ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"7ddc8796e4e8b0161ef7eb44762021b57d01c592","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.39.0_1637610086764_0.5590127460395173","host":"s3://npm-registry-packages"}},"2.40.0":{"name":"@apollosproject/ui-onboarding","version":"2.40.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.40.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"3c8856f03eb104484cfbb2a79587cb703bcb3963","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.40.0.tgz","fileCount":87,"integrity":"sha512-k0mWfv2ntwFaJBqQboYnsLVYfDsOxgjqcWBPeNDGf5KegfQCz7OFQyuJay1NJ4/9Gf3tIYZP3cnuhuO0YY8X9g==","signatures":[{"sig":"MEQCIEPaJLBlob5KePwmarm5C+WhIlb+J3c5NxGspxTtbEQuAiBLN8/umYhdTLbRrZegGjZlH9VOe6Uz8Bnlye3N7z0osg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":841909,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhrr8cCRA9TVsSAnZWagAAdVgP/06THy1nVlEQFAJisaEr\nPkenQlnvPeuHq7V9tO28p/bI2e4GuV6FUtUGNKgfDQPulN+HtGETbupBlLJe\ntALD7zkRZ+jiaD8H7b8O9A2936TG9ncBfonlHeID0TE656tl2JVaf7CFymFz\nS5ScTkFSsy0NJHrn9ZBf1zBny2zroLmVJK9DlBbCXboa6NmYBdlUQADVWobN\njgCMQYW+F2ZmxNjVm53S64lmgQi0yAq9vdNSy6Rt7w1mSYHBBjpX0B2ESaPf\nw3RWMNas6fUZrD5Bbh73Sly182H+AV4ES39CZcDkaFE2vzZRbKs+fzCqOiO6\npVIy78awKB5M4nZflsXKve8jBEAm2znKWmK+TfBU6EZpJN7xqnIw2TbXJaWj\nqgdY+Va58jroCOLfsWjQ+GnoXvIPpQxbHOs9Z7VkAoKNkGlOz1Wk5K4ReG+S\n8KnNOa1bVQWHjIik40eNhk32L5aG97k+rCkaGghUELGiJET5Uh/STaDbXPP1\n2/ul3KKA0PRPzFC+GKqx0H7fvz/n//VRnmAgLma61YvX32yiGS4fCLdE9zi5\nmuVP6HaAJjNRdG3PGAkRudpgOtqkA9tXDVAIjg6WR0bUazQ8amkRQx1v3xVR\nmkMXvn00x1dZin62Esa7VakINiPlYQqOPmNy0Z50fRd00K5e3GTosdcpgjwh\nNZTk\r\n=oehC\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"68762ec2d0da91490b88b0ab8d11a6d97ef7f81c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.40.0_1638842140011_0.4892013426122701","host":"s3://npm-registry-packages"}},"2.40.1-canary.2":{"name":"@apollosproject/ui-onboarding","version":"2.40.1-canary.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.40.1-canary.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ddb56ce43faade790eb69ca336f449edad65053f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.40.1-canary.2.tgz","fileCount":87,"integrity":"sha512-8XHwyKofvNSuVA5tY50KkRzmz3DXXk5kkGtdhhAUbliIxQp/p3MVxyR2x3jnnJSTtG5hd5dttkyq6zzbvUk28g==","signatures":[{"sig":"MEQCIAQjFy6dfm+lRWVvIMUN4dnSHqHfrRvv5AMB2SVHfaOrAiAUNCn8zT2vRp3KfVsr/Vh1/Nox8L7CqenqUZE7w0NwzQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":910142,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhsOxRCRA9TVsSAnZWagAACEAP/3cfI4UxSQnquEVFxXdP\nASQUkaEiAPr9t1gXjT8F4YviJ86LBI/rEzZs61HJsv2EfJ4YOzd/1PLQiaE5\nCXUzwwRBkIcNAbQCe74ay1mfyFNgTaadolaXASDtvPe0vyXYEZLVY+1TIiTi\nTqEVQMDzWBb8q+rb+AwiwCVCQxjgghrzuo+vhvRKyaxFfKPxxOBsEgHCWijb\npcHqChC5vZTfK3mCK10CSl9d5InkA59PwjSZmjWTCQQGE/mNrPqwJvaOu9Jt\nqtF/JnRyS2i+IH09js4wC+oThsr6Rp7OkbBnpxAyqtKYb/CoC2AZIXqoBtpJ\nWBVUFCHQZoyu9kEFwzAJkqMkI1eOofDFC+WuX6FIgtd1U9BFsamwwEq0irkJ\ncJCF9/WnZlgZMUs1o0qwllaRzR8ek2WJoe38FtHYpsyiY5ZvSXjNzP+TURH4\npQNRK6qqQosXeQ02kjcepHfh+AlQWjY43hI9+FzC47RnLtTausX0LFSRNbSV\nVj2iuJlXcxhJt4DXS/YL+o1EPwEMb+qAAHcRV7dmhFl84tHlXK8hJoCcReDa\ny3ZluLkejl3I+xLBGGFy7p6wsor+zI2XGbB5hxGnrvVw28n5rc0oH+ztMxzw\nHieIksClJO22l/C6WmX140+5qyrkN7J+gaE66VFcSD3pYLYbKrTAqwLt35Ym\no5QK\r\n=Cyoe\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"a78539fc7cadc44dbba84008adb3c27364cb882f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.40.1-canary.2_1638984785187_0.8467654265356281","host":"s3://npm-registry-packages"}},"2.41.0":{"name":"@apollosproject/ui-onboarding","version":"2.41.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.41.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"3dcc9353f63243c10e571e09fe019610fffb098b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.41.0.tgz","fileCount":87,"integrity":"sha512-o8zW2GmQVQL+Ee8XRYDA1gK3MPmEyO/XpO80ieVLAcna6vDSsq0R23pk4SrVqDiNUgcwEWdAztYs5hj03XnnEA==","signatures":[{"sig":"MEYCIQDPB86GzLcmgcu/FTmuMrxkbN2P6PLMjGR9evhiLTG5OQIhAP+83eqR+OR3q6vs6DE2QjcRKdDDFQXJUmr3+C1rwOb+","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":910299,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhs4hbCRA9TVsSAnZWagAA9UIP/3PY3zAyqPiUE8SfWesg\nSa0+HI+g0eXW9gZlNXlYYmmkT1Yluk6GDjTPsGwEtxm73LTXPKe+v4y1PLmX\nvjX7sQkkL2z2SOzk5F15Qh1QgUxYiKv4urmqf3NEO5e7bIyLt/L4Lg3I4DCt\noZvzibh60c/KkWERuemDoKhbBpZHDizo51xfX+dlxSuo7dMYGzwmB3h83ACB\nmJZabrF+BFF4qYf0jYJkfje+iuC0FjFj8I0czaHHBXqg+1HR/6kuN91NzXre\njwitVIQJ0nNXmMn+v7+/vFhUt+8njiAkkkshNa5ee0U+X6XCCo5dUp8JECEr\nIKLJ6eircEOVSDUHJ+ZOekEWHObybHuPyIHaRBL6+6mWsbKIrd6YS7qTXw8t\n87jwPQzGgqB8BHt7/DG4kuW87PtN7CvdWPsthvl2Kf4lkoMJ+jXVEwuel1qV\nT+mjQSfupmFz6MYy49+uPXnd91mnHgt+LM93VakHQ1w3fiEbo/4kLukOfSyo\nVh28KuzKWP2tVllV2Ct3kMkXqZJRF7jmWkExzFCCCaATurfURgGeJjn3YMxc\nuwhmvJxHO4FSA5xTh0BAXwXMUSampoMpXnXqiPqAT3DnHxYRsCdn1wGdrCt4\neCxoU8vK3OBh6wajdRK7UscJIzgzinqiKxBNM1g+NBi0joyR8jBcCpkGebad\nDKgF\r\n=Hhbr\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"9392677975a0aaa8f8af6d391a52ed0198c892af","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.41.0_1639155802970_0.6216667696889975","host":"s3://npm-registry-packages"}},"2.41.1-canary.17":{"name":"@apollosproject/ui-onboarding","version":"2.41.1-canary.17","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.41.1-canary.17","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9f2abe64fda2c84f3ab572ae4e6dd540ca7642f6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.41.1-canary.17.tgz","fileCount":87,"integrity":"sha512-vaRq4VOoyzSN2wo9Ea+tvQJtvYPuSYiuKNJUiIKwOEgJcHx1JxKdA+TFc+TfGUren77vRcaH+5J4fs8jXq2caw==","signatures":[{"sig":"MEUCIQCGIPAZE/5M74/Rt/2aWqN38EnYiRU03yY399lONCMPIAIgGmgDgGJCYwlngsoYRKlYfGfd/4nCjQFDxcf5pd7Utug=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":910680,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3MDNCRA9TVsSAnZWagAABEMP/2yX45bwHnxxkANLvfUH\nt037pXxZ/7+LiJjJ9voQ9l2e6Df+oj66/QgFLl9B/KO7vxBGIfc5Ul7j/iFr\nRcCsniIHy7jEUtvZMM2Wmz92a293CnDDmAmLx2weQQFuKTOIycJ63FbSxiAV\nJIZ/1Zno+rqyToD6TH4F7LR4Qx1CDdc0V71BGjPnowvTBHUyuui43qBw/qfq\nEpfC2prgAeIESPsDpG8M2adgMcUNUzFePhC8DmNBiSlmw04tTasrCW6g0W4n\nvgRhBZbVOUOK7lSuugHtt+ahTWP560ddlEqabsO4ohAidLdePJH6NFZ0hYqq\nu07P/Hnh7KY0VVKHL3KSY+07EQs/pL7UCbJSdEBWWBCOWBqMq5LbnJT5hY+P\ndEI6KI22t5SNPQBW5X2BR3wxRa7iYkqjiUYd+rWYGwnmOtlI5SYQyUrQ+T6l\nYAQyvgUVbVY+FTKgU2giwGHoWOsEdgRhTWZndJnBJkxk/k2fCXUKmzMFpSDG\nkqaI3mBugisIPq4pQugGGT5n82pWUP1Z6yAVN2SsAJM9Sls7wO+H7lwsOvT3\n9YpbiVES7rP5z7+S0+jCu3aan0d+1wgNvcgXvWZnSu9l8kkCSpGO6+6qzn+O\njI7c/D2r7LtevX1iPXbgy4O68FkhaePqsoj5SlEtl9sNW6fdAJXNqI5me2Tt\nflDg\r\n=A9Z7\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"178d4c226665cd4b9ead63acd21989f77d3324fd","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.41.1-canary.17_1641857229082_0.8776582588696675","host":"s3://npm-registry-packages"}},"2.42.0":{"name":"@apollosproject/ui-onboarding","version":"2.42.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.42.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2d132eccbfa1c23975e80bdedad9bcf6965c578b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.42.0.tgz","fileCount":87,"integrity":"sha512-3hADc0PNZ8YmXIJpdCF9ZsBoRRLGOtn4H5R2CiksBFFNNtJPIhldT5e2Nq0606q58iuL0GznryrIcsrL+Gpo7g==","signatures":[{"sig":"MEUCIQDjEg9cSnVnXpncZ4SyfjPTZGAPnaWG47W+KVLT88DSlAIgE8jwlYLeFAPneeWvUyT8r6d5KUJNjheqUcfAqZxK9vE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":911008,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3bFaCRA9TVsSAnZWagAABssP+wVT4ywnQF//7Cl1skiH\nBZpI5B7iet2oZJShkGUHrrgaGxghPI43wFlPYux8YAylZpyQ49LM88hRmHxo\nuAfbKprBnpgaMYsjQ/3FkOezkaPTOq/T2Y7jL9mqiz4GIwKyc1/qvQpo3oi0\n6T2CSDMI0ZPty0Nj29adL+GRtxkqKBMTqVRlDMQ94VrDtOrl/PyNa3Xs85nA\nnEfgfP6K5hOqAw5TV0+OqD0phH6xOBtAibd5GR4XIP09OB9L3gBluhVFfA5e\nWXCQP8XOLNJv2XegZlvjt/T2b/CHW4K9GClis6jOjCuYUYzI+uCvnMdrvxfA\nXvWKE8toYxUB8nZt4y+xJ2Fo6bHfTrctC8kVRLxAYe4b5GQQm7+Ykv2c7s7W\nDUEdDaOFUXvX99n4iRgQgELmECFqW0gkou7FGqAvsTeqI3Mga/zA3jzzLAaI\nDkfsopKKOiv7asg15ZaU13MCg9Rsb7X6DTw+Ms9wnWp1fnTWh37J0xllIzqH\nPZs6yVR3s2Itj9d3RTVZ2EE4ODX8YTtCTesY/+NLSC1jRMU0LU2fYg2/CDi0\niWDEtA+8uijImW1T0/2vY5TdEpF2IFa9+gyHYO1Yb32kdcoIxjIg2StfydTr\nAf+UWzzGaHQZGtQ17roKu7pCovek6us7zxVu766e94NJG7GurxcUKp+qFuD7\nCKH2\r\n=ybnj\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"f5af5e7e8ac4a517ca6be7ca6793a82433cbcbf1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.2","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.42.0_1641918810535_0.21781285996117838","host":"s3://npm-registry-packages"}},"3.0.0-canary.23":{"name":"@apollosproject/ui-onboarding","version":"3.0.0-canary.23","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.0.0-canary.23","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a98aaecc3f71ff1c616de9a1a3a0f4de46e92df4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.0.0-canary.23.tgz","fileCount":87,"integrity":"sha512-H0uAXimAHhRHksdWfcYG8Zb9/NgQu70zN2ndhxxZX5NbZOm7avoh/Yfx93QbkH8FCBpK0uUMX7sV4Agn+lFwxw==","signatures":[{"sig":"MEUCIQDAq3Dd9eq+x3beOfwtTn89mHNAFNdctiL9tM2hGU7nEgIgWhlilFC6UBarbfl9QEPjUtKFo7ojEA2pCC1kj4dQ87A=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":911026,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh8aycCRA9TVsSAnZWagAAte8QAKBmVMZWkuJa4BC5Byb6\nQd7ys6dR+fF8JorwuIPN0zKqHe5COf01652Wf2BVQt8ZEoMmUKOputm8Rf/Z\nryG0rUYTL5Urn5i5yLRRu6K3H9ZCBNpEhyrMCBfMqinJQcNXLXNW/RC2Kyi/\nNR/BlvkPxXHeNJjslc64kQmbpLsjVLi40DCsmaEXcMY4ncR6Nd3OwONF0kT8\nuBtcq918WCSnaNY+sCOeHXn6sp6hqXOXZxN5neZtK/ruQ5oSfziPviDSfJAB\nZqPwuMfLAKskeQNpNIEWu0s3ZJmNt6Kw1rykAm2zXZyUKGcc94O+I3qbLngf\ntm1qXGFoBBb6dyipF+0/51XMthztqD/v+6RegVVHrYEvG/I3jWZRsBx3uqb9\n9Nkqv2YwhzEiwqmQFe8dycXEFoZFw5ImBL1yUpSZOu7BxDBe2sKWI4HV5+A/\nH8oHEpIIHmAhuo/FkgKHcmYDyx1UYqjdWqpnq5+14x81+KlC0beVUt60tQXO\nYIYqZGqUOdEBblbjPbjZ6Io0FGjJEbSxpvzo28H0b5YaClvkGZxkhktOqtg4\nFtyk9F68V4o313jvtBh9+khVgn1NZnwd9PjsU1HvAnAzGzxOO1Ey+P8pbBXf\nwFndTpmXpLY06rEwfpq6N8MxGlehNClc0S1KrmiKEv1kk5/9RdJeDBXE4c3F\nH8fS\r\n=xc1k\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c9f2bb7f9b769c4611b9241b0b049727f538881f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.2","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.0.0-canary.23_1643228315938_0.3939405370794993","host":"s3://npm-registry-packages"}},"2.43.0":{"name":"@apollosproject/ui-onboarding","version":"2.43.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.43.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"dee39b0b370c1392c2551559ef2823f13799538e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.43.0.tgz","fileCount":87,"integrity":"sha512-BfAlvo7F9amcaXTSXNe/pcOqZH6zLRxpu+8yfn3KfDNV71mUlzm9hu4FChgi29Rk8EsA9nVKYOs5pGBdV6UqKA==","signatures":[{"sig":"MEUCIQD8I3Gskg56yuq6il5TGMqvMVfKUgtObSRM8EFSfsk7JAIgLwdOpW9dCW8CDanoHwNAT3/oZKaWR1bxHiJvu7GIf60=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":911183,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh8yWdCRA9TVsSAnZWagAAki8QAKTkOacjLFSNO60NQJZy\nqIjGJBYmdVAEZMpJtHFONwZf/yUoFZALlQuMlguuP5wtzRZsVCh0+0qkr0t7\nTiYWwyiutxl6GRV09Vb2hlmjtIGQxV9vDFcvpuajkIG3uhlFGVFH9TRHFQio\n/05fS5H4A7mnnG5C8WAFOmHigAs0MvBngJ/lWqtxlPDqOebvXkKGzS4xHHrw\nML4lz5os8nYHxnb4rQ2pUw2Kr9K9Ev39kKOinItMeqGw0P2kzRZDbCJNpxXO\nhFM0X8SO/AYZWqQPpT5VrtW3FRyFlwtGbV+xIAz5lRUdmqJLh1yMlWKGdeIt\nuCXg4YYmLEH47Qnm8e6BFfu7OOfk0d1yvGfLagq+FEcHO4VX5aQ64Y1DLLcc\nGRLNYVoHU0hZc70SB/GFK60nLXqM9XPiRKOGPE2QhTOs1/NIFKjG9tonTaeR\nx7Ep1PfQR5pS5QYERPAsYpZJLKu8KiolGN886+uYGYSVl401ChdPtZeVRpCS\nBKpE31JVELZhcxDSwPMvUUzDlmvj9SnBtSuMsoAvVgfCB8OHK0ygTW0vkEMC\nmgGYf3e1Yy/1lUapckIvhe5xhIOB0ZRRtKnpt8W/B45+4cLv924qC+20S5kO\nw5Xq9o4FwAamDbGD+VKUKjwofkWENBJjSwcxCSoN9tnB2UhwR/6WTUYxQsAB\nXdET\r\n=FZjR\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"d6765b891d1813cae128ae764c7bfde6aee3c7c5","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.3","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.43.0_1643324828987_0.8552209116212095","host":"s3://npm-registry-packages"}},"2.43.1":{"name":"@apollosproject/ui-onboarding","version":"2.43.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.43.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"e024e431170044d29d2a30ca012916cce2bf4334","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.43.1.tgz","fileCount":87,"integrity":"sha512-fwbFKCPALb/jyrID8D/5+u0uw0qLmUzkNcmCMbsHm1OZNvg430thbaHFnXShuGbKP5ZCE97B/JZbIV/4UFuuSg==","signatures":[{"sig":"MEUCIQD3Sz6jps5QMiO7H9/qOHDQ9MwKpBldrM7st0timqNnHAIgc52mXfEtOkczkpWHTY6IaLgAme0REUWJV/xpyd7UpE8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":911359,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh+be0CRA9TVsSAnZWagAAy6UP/iHKstJUuFknn4W/c6mC\nBMbhRT/NIwGwxK9KoNqHP0+KiA0NcDs7m/qYvNY5PXCeTbi8NWUS8sGYR6q5\nBRRT/qrfDKeDP/OuNz72TEoLmVh+nqnmcFMfAAPzerVCiiDG3dAuzgCGi1B6\nazwGYtKepogdGhVnwN54qDm0YmQPg0mMmFQflsucAmQOQEY0OdAS2TKThhU3\ncBKL30simJW2mGTT30KmCPXwa9UGaKG4B2tvEPvxfYMNZfoA0eq+khuD2r5J\nsysOV2+18qgWsJknQ5QV+iF4afxA/Bb2ZWCNp6Eluy0uxe6yBikjm+rOPJ22\nSG6NoKf26EsafIgEWZJ8scVSzR1G9VtFuLAz3/606tflRjPPCZl/VWcNSr6X\nWxV84qDAz/VZ6RO4GWqT/I1hdVJHxNnikrBVr1xfSQbl1s4u7M8QTIyUH3BW\nkuhdXaTJvB/pdQLkIUiGp9q5ukaZ4gBWqNbPrkKPVUUp+fEm+fUzrE3ISh+C\nyC9ubFSRMkCKI7DHD0PfABuBemWQPg54A2p0jusGWoA/sHb1yn3txhZaip1I\ncgvrtmAEE9ygNx3zJkIIPLzzb508SaNKb09awLZyfgsG7C+8fipzsGzw8M2O\nyDVYOCLAkADYQqxaUAdvB/bJwV8h6pTTPLjI9aForeVLMtOdSESUPcffw06L\nNNza\r\n=uFtG\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"7cbe3d1415d201010e932e19519fb20ee661308d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.3","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.43.1_1643755444648_0.16408724100724537","host":"s3://npm-registry-packages"}},"3.0.0-canary.36":{"name":"@apollosproject/ui-onboarding","version":"3.0.0-canary.36","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.0.0-canary.36","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"61cab105a2cb99346d8d3c4232c9dc8c2e5fbd83","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.0.0-canary.36.tgz","fileCount":87,"integrity":"sha512-RfsoidwhsIVKJLxDlG05N5gX2M53De5z+AhDhn/KvqlFILee8HnRhYyLcC+C2axcvCO/diz32fld3eXZtIS+sw==","signatures":[{"sig":"MEQCIHSYSJ0ofoQtaUC3GSMHPC6jLWzXZDhbjtEV5aR06DKqAiBfKZVPmaXzlTm+1QZKlQlTDqRVDyfEVksQogZRiwEs7w==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":911377,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh+qBaCRA9TVsSAnZWagAAe4AP/iMfoJl2e7NkhDNYHKo+\nuoRyyN8fxkVlZw4IVW+DPtuPh7ebPNoYB8WrpdpwegDC7bIDehenvc7NvCIv\ndijPJkiFNCvU1gJlWaU8JFh8Y8zC4nKwttyvHrin7t2li12ZMQN5Tzi0157f\nBADrCsEj8td0qp3gW1sD0KW/TVvjLpDLLbN8nmKAj7/NfOrFQc50NbsM99tP\nxhVjplvfAHxbKOgCCwjbDUX9ImHSg3t5iTwkLXcMK6XBF8RNEuOy9YiOwpJl\nGbXGiMonDgOBS2rp87FRejUTIojdupBj2lkVRrU1YA+XUWPYB0HE0XinXD4U\nA+hEjbY+AMY1yKQDRdxkPoWbwPSUbzN1a8OyNSEELvh/q59jhGsVapOCYJgE\nVNfFzaW+OfZaFt8b+TZ2YJTHNnJVe0W3oKbreQ8qovkYULCQM+cUQyVWFJ8P\n3/wWRLKKHE0Bez1G9rD4kIoNx2EhaQGKWcEPSmfnS1VV4lBz8vF95uEh85dx\nV4PkP7gQDinFH9lDJx1t3Uxixld5/qH6U36Fp/MYHIYEskyYx+ramB7zz8Uu\nFRz22fneLs0V0a8+4ECulgBAU+DkzMFntxWWLavkGeBitbYGvoQNY6jk8Ysh\nehPo8u2VkGt8blD7AZXnwfpqLCjAFPznZf1hQlsahZf4+ADrWSSOPx5stGeM\nmCKJ\r\n=JGSg\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"1db55d6b0134bef10b649811d5ad9950d02ccfc3","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.2","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.0.0-canary.36_1643815002423_0.20237563536650494","host":"s3://npm-registry-packages"}},"3.0.0-canary.41":{"name":"@apollosproject/ui-onboarding","version":"3.0.0-canary.41","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.0.0-canary.41","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"472e01f306ee76a7079b04e92958e3156965dfab","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.0.0-canary.41.tgz","fileCount":95,"integrity":"sha512-hvYUwDXLz0pHQrq2N94v/13rudKcgONuYx+JYFD1UHwIMg23HWQ5OMtjHdPx9/TKhyLfPsH93JGxxwoakZR3IA==","signatures":[{"sig":"MEYCIQCIwiVMX9fHsaWuElPgkwSAaQ/lDsJY/bpcGoFrb3TYdwIhAKmdjLzFrHoDYm3CLPkh532NxBdmguZn0M3UxmjQzgeG","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":944248,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh/AZrCRA9TVsSAnZWagAAjwAP/1Ou0Ayuo0+CEkvmoLF6\nVfFeisQuDgbprQOFjHY8P7oGoVWawKIo35lZsKjqhPLVQo/cer5nfoYQkV5P\nKZMcZBvfqJGnIFgGMK2RWkRggODoF+d/K0TWK90GG4OLlLFlY/gjDxNw827e\npEqTNUOOaZfShQe5WrNsb8ggefYtnycdWngY8aBmd5olP6docCKcYLGUTgdI\n5j3cpb1EJQooVfzgaZnaJF2qMOSrxms+sedA9cf53+YETy+2os08BJpmGMDJ\neeQzNyvSd1GSKOKKSntsS81/Nx7aTcYPx4OOzdSsCarUpAurmNd9kOeNAiNH\niC3srlgD671mtxvPyh2PZbuVJIzcnCwGopASF0vcLi/jUduKDxlazRKWf55r\n3tsWjsG5IZ3rIDgrH3VOhJtX2by1dZINXsOCRKZyDBJo6smebSRiHBKT5BGZ\n5LVF+gVmrAKCVmfIyJv0wrq8bhutONr7i5ZFaZu+JMQKEXEn33qHdcbrXKee\nuwp+AG+fvUloMoVARoHzxW7E6hC/quqVXczC1U3ZXIVXRQ6cgtkgwxtf4Kzr\nIX9pRithpLqcKaDj8KVIPKeRDKAMkyVYHFz6xPBRaaCVlAQiZC3dfj5iXNGE\nC8cHzaCzBxdJOpdRb3P0LTusDtzz7LeoDZ3MlOS/5/KB6RM+PsnjS912Opui\n0vX/\r\n=CVIC\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"200427caa0613cb33fc59ac83821e12929e8af13","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.2","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.0.0-canary.41_1643906666925_0.4805210578613104","host":"s3://npm-registry-packages"}},"2.43.2-canary.6":{"name":"@apollosproject/ui-onboarding","version":"2.43.2-canary.6","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.43.2-canary.6","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"53020050f181c8184163ee25536e7097dbf2cadd","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.43.2-canary.6.tgz","fileCount":87,"integrity":"sha512-tHSm3T+jFQsjrfRnbK++vXS7l4acCan3AzQj6ohWsFduuFZlPxvxW21WaGa5QGNVwnw9iSi3d38vxKQKcIuAug==","signatures":[{"sig":"MEUCIQC+K7H2Fun9FxhlXJBkdIN0GOeP+BNB3cj6kkdEwCX/wwIgO8LpjgcTLe+D1fGK9H8SibnWnXl7uOfNjnz7wGJqOJc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":925763,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh/BybCRA9TVsSAnZWagAA9UwP/31S3dxqyavpJ1F/Fv0K\nx1G5uH7l+ST6TaZqQ8TpPljG2H5M+t+cFHGX87ePFOBxmkFJW5g2fL4D+Zar\nk4XQ5GUdxj6FEWhq+EO8C3C91KL6j4kdKlPkNPpjrELF2pGqcMwi9nvRUtu3\nFN68b7zjLxcSXaYkvQXZ+5UbdByNOdhJK2GJl39TTcvVYXhZkFgvIRz4cpSv\nhlvOLnAUhLQr7zFZf+z3diAvz66vxjNcDHr7W9ZQgQunkNP5CI9MMH5rj0bf\nPFBcmAdo88ERUzxg8H7cmcqhALnVzNcCkXoaElZ9JmQ9hergwgBhGaK3Bcnz\nqlOKkiV3SFLfYF7W5Ytjouucq+ZPIdRa13GhGKy0NVYwj1adH227AiiLHwAe\n+mQ2o1cPaPWrk7V0RtH2OKRBDgEtRn9etY2FmbOAay6B3bql80UamHXGa2M0\n8f5AhE+w97rRZBj5ouUvk/3N8On/fd2UybyNo1bvVl1yy1343RSFu72h66AE\nYgFhi/+v3u4jJO5IWxRfisZzn80yf5EBLk/rxi7OhCq15ii8PraozsxuIvP0\n3OyKh9z9VUyNGQ7noIE5pSjVYXYcEw0s94nBe3OIuIwP7Hey1bGIbjndVgCd\neJjpoATav87ucBNZCgkbVGqQT6CFhOm5VuAPvYr2MEN0Q4OgCrIvcrrkUkUv\nY50V\r\n=C+Xe\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"04ada63ea9db1b3bfb7e8f91474c380f6c8861de","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.18.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.18.3","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.43.2-canary.6_1643912347258_0.8739624639650081","host":"s3://npm-registry-packages"}},"3.0.0-canary.43":{"name":"@apollosproject/ui-onboarding","version":"3.0.0-canary.43","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.0.0-canary.43","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"37143f64e7d6bb4d0db0c2cc184893918fec18b7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.0.0-canary.43.tgz","fileCount":95,"integrity":"sha512-lZSvdVWzab4c9xvv4/v7TP0YmevWr1/cePMWBYG7TOoQ2CwjtMhrNi9CiUB9MlJ2oHEw009CVJdGPcNcwpOoDQ==","signatures":[{"sig":"MEUCIE8CEiBY26o4o5+nYbw26dd/xWHNYCvH6RDNacVvIIy0AiEA1A2/7LLt3j/DkvCm/x8F0VgyewYKfmNq2RZqOiPBKHU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":958688,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh/ELqCRA9TVsSAnZWagAAj4QP/iSJmgCqDviewfcgFpVB\nfWXUcuWbzH7gmbpEtiwqH4Q73btJJqS7E1/Ru9v/NiniA2hBbrijLnjqdot4\nRdcoTkKYN+/f9hMKy8xk3ORZNU9rzdpHVTvHYI43N4mOvunP4yvYxfGunIz3\nvF5hcA+SM8X9HZILiY5Bs7lJjGF6Wf6t/4sngCYY3bYN6VzH+8/igJiS25I+\nli0+C/n+VS3xhUhkPROfAGrH7DXIPYEXgUX8xEXxjnPVCqg5gFRyC+WZWOGY\njXEIkiylo2ffZ3RWFkwfD826g9udDzM26i3bI6sqsX9kvdouDaklzpuh1qxI\nhvHh4Ct9tZpeyHEzLK4EpjrZ1WfcHlVu0lTdj0hmXVnWdb0dCajYUJndR9ez\ntqjVKwUX73mUCQvVcWSO1Gr9Mk541PiqgsjrHA+iFdACKV+hlJaz0PY/SjFY\nfV8tbuonXswwmyL5iMYFaKN0e21HUHaZiKnZqL4vKS5NYO6nl8qIfmotCd6/\n6s0bamSD6avvF6o0hzEPywHsVO9BUOMJY0wCC3cvWc/g2Z6eWRXuwVW5zFjI\nHtxIXLadea35DX0XmOr4lRuOyr0lBj6PCj6NUwbhE4yA5XqP0atgeq8T/hfM\nuOqeSmgBmfb6je5MNsSDQaxP3YVqIDpIEMcpZS5wAcbT7dPBW+KGeX1dpA5o\nrt2Y\r\n=292d\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"7759329506264566fa22a3370fd07ca9429a6705","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.2","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.0.0-canary.43_1643922154555_0.11109275503648153","host":"s3://npm-registry-packages"}},"3.0.0-canary.60":{"name":"@apollosproject/ui-onboarding","version":"3.0.0-canary.60","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.0.0-canary.60","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"8639b7c38fb913f1ebc2952ec4332087405ce44b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.0.0-canary.60.tgz","fileCount":94,"integrity":"sha512-roB+eHNievTvMM8IoF44rzj5wp9tE7MON0IhWM4DCGBRsO2TtRmrG+ItoyqYcYMDRNiutOAIPnn5DJ3ZE9zaHw==","signatures":[{"sig":"MEUCIQCk8A8my+n67cN0bLcV5nHPhwEcN9tY5PyHvC0+/6JEcAIgWRt+qsOFHjS8HsmvOeu8QIvKjs71gPKY+eK6uq0M4uE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":970762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiGStEACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqiQg/+KQkTA+klIrrmRundr8YaFXxwWHlgGbdicSzkQydBkuro8gsK\r\n+7d5bntyBwaJOEyqd5QcFanAFhwmK8YtrihMYtx0NFQ6Q+cbbS+aJcrrea5q\r\nNsbERuKT48O4GGa+g4gC5xm5PouIGePxbjbzs+KN5qDCf+rjFLund/Z8opoU\r\nT4Zcbu8va0b/d9Sabgp8ERiOODo1KzIJG5GF9aHdnRiSNqAQqmH/aNFrTrJx\r\nRQTAka0gOAxCU/tjp5mm7qBurSVOyj2+ulPMInybPodQvogg2orKEOeNTDkx\r\ne+n6q5sHSQuKsZR/Fj1gazUFHJMoiR/vks6eoKNWp7CInbiQioq2kdEto7Nj\r\nBxkzQFId8GgDEE+55U2iLN+0nBATg33azNhS5vC5XLT7QSHlEG6x2nATgznE\r\nxgdyV2OWDPJiamRVOzSR4DZKKXihuH53Ap5cC4HR5Z4bkSLoivfg9aOm8KZB\r\nOH7cFlYF+eZO7Ggv+J38QFa5oyl9KJQh44OQjyIscOYrWq+xrhuKWF1Wt+bq\r\nnr1OMgvLoGRorSFQWmpptQzKgcc0NEquiUkmJTQlS55h9AbeuGKCC9boCSRm\r\nWMHQOgogD/CnYBIedDBwCWOTZlGhXwu+cKH+9Q/LDyiKlNLlZkbskCBHeov8\r\nrJYRRFY8T5fH40Ois0lTImio6KA7hanldFA=\r\n=uhHH\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"753fd5bc333b42f5103af0db2abe16cd37d88d1b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.14.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.14.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^2.43.1","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.0.0-canary.60_1645816643824_0.8377875937585664","host":"s3://npm-registry-packages"}},"3.0.0":{"name":"@apollosproject/ui-onboarding","version":"3.0.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.0.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"3204d7dc62fe0ece1fb4b832f82f34435d7d1442","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.0.0.tgz","fileCount":94,"integrity":"sha512-PISXIgds2JeB4gXSrUBOE2My24RTIZ1Uu6wBBj6xkJpkQKWqJ/pvjC0TBibsypQi2mdTkUaUvcAlddKZA3aSJg==","signatures":[{"sig":"MEQCIDWHHJ783JTNaF/wABQndteFCRVpz7rTJKS8+xA/0U/LAiBxn/TP313/1QNFhn4zxLst885xRBEgYxpivj12QXl4xg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":971698,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiHR7QACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoxvQ//faJ0cTwbCU5FaT5xC4cEj8zx0ekMqeYXLkyamZKeJwM+Cwrr\r\nLIThaPEFYnYrDoMhm+EX5BWYgJRhXuRh5xRYx6qnptL+0IIzaaqwNnT6hHyz\r\n+TJ0mRqo7AojSCcFEDz14mB56Vd+Gkn7zfIAYSNY986hbHcVRB0gPH+9oqzN\r\nVXcqKoOVzzlugtEmu47UgzNz0L3iH1MwI/sPkxcl9l4ffQUpVAffPYTnoW06\r\nPTJ1cmnS2IL2Cx6i0aqJdHy9BFiA38fTu3uUxfnDIxo3NtKJ6Lerpp85pc4p\r\n7SEUeC3MQ/+H9NMXvpL44dSldTKVbzIar+vVAS/ZWLuTZUhln+6H5Fi4Cl4H\r\nTgm5aDdRK8y6bcwVIQTi4yL/qibCMXIIZqfx6jMOSXwEOzO3QE42RjXWEOXO\r\nWo1J7GCjG+TYMTMxjDggcCySjygBaMH8NtHt8DoK5nOt0e/2fIeVCiewLQ0Z\r\nGXDkbSwerBV7SsJud37yU4iXMXIWcs+HWDs/9aneBTfjkBYPoR7Yn59cM5tD\r\n2Fp/ugGKckc5KmBeG6RjXgUjskRhRbfNQO+uKVSHLsf0JbtTWKFGui9PF2bd\r\nV041ZXcgo5L93BlGFyTu4v8XObfkcvZqAAisy+mO84hcc6I/6yb9SLBuyff5\r\nw+Cr46bZlVVn5wtb7EgfdRcjpl9H5fTqfvU=\r\n=1cHH\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"2e3adc74ceb44f2bae7bb3f70db0c6c6e0279a71","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.0.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.0.0_1646075600364_0.9160527314667468","host":"s3://npm-registry-packages"}},"2.43.2-canary.24":{"name":"@apollosproject/ui-onboarding","version":"2.43.2-canary.24","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.43.2-canary.24","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"97b8b9e6dac9e3a109f3d0be774c894654419cc9","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.43.2-canary.24.tgz","fileCount":94,"integrity":"sha512-NIaOUpHG0YaeQ1+db+MVt+R1fKoP9hbf0fQAahOu0SaumVINm2svVxvKs7+F1heegsOpL3LIBWGpWUknJ6IuMQ==","signatures":[{"sig":"MEUCIBOF/kGeSIUqRk8nGfl3fCjUug67GQNb6ToQnsyUobfIAiEAhUtrWJh91uMwPiNU3eE3TJ0rTZYFBHV/D1spxeHigqc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":971738,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiHSyPACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoJTg/+L0+2NIXPkYYUUQk8DrwaKYGB/xKI645KIB/x3dMuVaH7PC7Z\r\nyTE/yJI1A/oFqOPkHCUSFSnoSfsTg10cgLeeGCPIuBCeJKNZY6//HzNef40J\r\npFLNAWcoxyZY8lCV57RSFeQDYy6R7Z23NlgP9wq88QMxI0t8EuSAhQfRDno5\r\nbAvcb+coER3FgUoG0Fe5r45bsCi7o4BBYSx83BJhaZ75+uThfKffdUo2wpas\r\nF4+U+ABzr244MQ91Ff9amBLGnCynRJRPVKfL1sDQwgNoBGZ/ptJysj88IHmg\r\npbHRmtFMognRtHY0MQs8MDSuPhLwIdqQLEvHgdTobJizoautcTGPdRYG+dz9\r\nqoQL4fg3bKj944Hqb3OqfpVjagivVxGWyaUfGMN7XZ8qqeeUDOK4gIozVUxG\r\nlkfFq2o8I6Slwp7ahQbVp5EXMb1Fejw7gfWUFgpCAsZjo8sE9JlorDrTVJTf\r\nSOuGEVUlg74ITRh/s4NIJuxy4+QYEPFQD7FsTNACT8TZdZAD4jCqg0ufSF3l\r\nQR+T6zfupmAloA0SS1jMNQnAPlTXXz8Vqh2tLKwzTCikl5FNViwAWfANeJYY\r\n1u8JxuCy1JPEkOXpvOxwZ+1Nh2VMcznIB5clrvlGNb3uwjXrNMaWor591Ocf\r\nfSjRgdVkJKLklXVlg0fxN2kB3LzoB+zvPCU=\r\n=1y3Y\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"9bcbbf4b5d64a6c5254146b3a360badbd3e1f236","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^2.43.2-canary.24+9bcbbf4b","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.43.2-canary.24_1646079119385_0.021488183973069175","host":"s3://npm-registry-packages"}},"3.0.1":{"name":"@apollosproject/ui-onboarding","version":"3.0.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.0.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"aff74cf98d2854eb57711e27eafc9cb7be2ef577","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.0.1.tgz","fileCount":94,"integrity":"sha512-YOokd+LNTWNFUo7uLwQCybjHUQ5klaAQYip88dC+EXNKPQcnPgxpflcOxiU4eAqz9waF3k7+A1BTd8CsUGqhEQ==","signatures":[{"sig":"MEUCIFTyxPdLXVAp4Uw8YS6LpJD4pAV4DiXoALtkMokQnS96AiEAl/gThaUZFCHNzngsY6/wQe0uPw3QyOizlpkn/6zAJXA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":971871,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiHTauACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqm6g//dT0qOjzenl5Ta/EKn5z9/AtUkkCEDXRmppL5NuSyKHR1d19l\r\nFuy5BQ1odKdFRSB/jipsXK+WrbPnASJa8nhpIdOQ99XQTTghPyIznngXgLw+\r\noFJFMOan8NhL8WaHJt975eP95f7Rc9A9EaBf4w+L1HJeXDHV3ywwv02Kpewz\r\naz2MPlR6og5oFvOv1vSjNxUaXOTWltOPbE/WVhcSpoW2hv5u97lbhVBDtakQ\r\nOVcy+d1CGuiI2YfoYefooHxnlnm4k9unqSjtcBj2IgOXsTID7c1SWKnc6217\r\nv4haXuF+qPAf18EaI2fTau3O2IYmGo5UB2mzUsURW8aI3LhiXxaMf2lFjOtE\r\nxgz+fCkGYep0SPxXfoJvfoH6xA2aH5unjPegGdeRAvTBfktrHgspS/gCGChQ\r\nokS6/Vg0kTifAf4A6/oVeambV+tdz9nvPpy35Q2INH9B7f8R8XyHq4J/HG44\r\nNtcadzUdD6tfycFftf3y5F7YDHW7c6JtDkW2zGJs1U+jyWmK+YiVZw1p/Vpe\r\nP6lQUaaZMpLci3fBZXB0DBm9wFdfz5fU9g55JPEkczwPAp6mqczjZEVr6nww\r\nlm3cW8/zA4QoZSjJvoWiNrbEIpzqYCPyLKrxgjPW9tnnS+8yNKL+sKedsqU3\r\nz5OMq9zJG5WCLLa5jM2TB9msi5b6R+qFzE8=\r\n=6+kR\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"530b55e67362f64cc89ca0da8d7777e0558d844a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.0.1","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.0.1_1646081710590_0.12003908894552695","host":"s3://npm-registry-packages"}},"3.0.2":{"name":"@apollosproject/ui-onboarding","version":"3.0.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.0.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b3ab2ec2707daf160f81f8d10faf63eb9a646fe3","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.0.2.tgz","fileCount":94,"integrity":"sha512-+tK4d2Xq3u8iGH7h67vRj3Vg+2/rhMUF6s/ZuH27VHspv1Ln/NqbncLxj6AHFHsZmEaCH+d3AL82m/ZUFXnTrw==","signatures":[{"sig":"MEUCIF1m/a1TAhsib9jBnNgn8VARmT43e5oMq4uB5TlIT6+iAiEAynr57hp2aCPcxAGvNzDLJ0IEvUSYtZ8K/svx8zRGU7c=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":972044,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiHpYHACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoaLA/+LDEXvfmwBAUFXFW1CWeum1BQy+YrwtHwqmGbZquM5Wfldd5n\r\nh3FCHTWvbLqLMXNvjSfVUlSb2NVS/ACXqEHMEkCF9JpSKBCNth3LzmNuCF1m\r\nWdeMsW2yJpefTIcxSxk/fDdCUim9EnYnRGs7r87JhX1m2/pXpc/P22jczFSL\r\nXu32ZMrmml41XeTdg441D2t+tVpJ+6ERvqljeiDd+iSioJtMAHQs0rbsywyW\r\nyMwOI+zLZs6beoBEh8rE4Z2Zd5ONFWyJd5K/PIWa0Home7GLAzHo6RVJOUh9\r\nxR6KmMItPlteSAPnrKsks9LATwWwhS4HogE5r3EoUm1QCgv3AOudBO6zyn3E\r\ne5rAjrCDIVCqlTcMUTaz3b5O4XaVlQQB9ZxiFkJLfQvt2GvBVIrboDvC8y27\r\nlQnBakDuSxYtFFmwwO62477z8lifj2g+nikauiHOId/ZNW5qpJ2x0HzwVXoR\r\nRNf5Od2AoiKOInuTtWAInZ1YRyp9EwoxYyi1xwk9v9zqgIvspTxPiwP3YzjV\r\nVmeGKt8Rnq1WdT8mJou7E6sXewKqcqt7I3VTHIvOTCsFK3YIDAa9Eg/GBWbH\r\n2nFUgNtIszWS7n+JqNrPd7msf/Uf5kumyliNjaNoIlbsEaIc6xWV4h0qZGP2\r\nmgoh042QwjKkIqT6A6241d9h36r7mBXORgM=\r\n=qjcA\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"ac5f551f297e511e0651dd4841b7483b412069a4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.0.2","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.0.2_1646171655710_0.6043121102858076","host":"s3://npm-registry-packages"}},"2.44.0":{"name":"@apollosproject/ui-onboarding","version":"2.44.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.44.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4f7f83fa983542fa89e682fb096997d7be395491","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.44.0.tgz","fileCount":87,"integrity":"sha512-TlKYP94HFLoI/8ZM1J8U1fAb9PpWL514G4Jc0VF7le2Yubecq1ngNhhaWPtewLHw5/p5eO3WfO/kDttblamAbA==","signatures":[{"sig":"MEUCIQC24QmoaB3jF6/dAhWf3ghmKtrGAdYPn8GHkYhZ0lcsEAIgVRpIRzjnzPnZExrJuHKfmQ6SkS5L5nvgGZ9FgccEmIo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":926065,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiIPxmACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrGvRAAifUNcNzWezXcE/Mb3hKy34pC9HlNghpIyG5rmE/ymqji+Ndh\r\nzvbXsgrcNQgTlEmXzszaKtXKskt8SDe7gWNi9+i/igH3zrellI8Dc/IV+uCR\r\noqajy1G15g76JrKWsr0GjpNnPU8sJJiS4+A8zIUNwbeEdcQLlyt65xNCqDUg\r\nkuvN0pkvflUHX5cLkE/RTDsDtvGQEdmvQ1kjS8HlT3mHZ59jyulVyHZryya1\r\ndadiqm3pceJZScDrqqInMiI0CZnGksEKMUNrHhSPzOkxTzIBZAqxJwCgGo0i\r\nKuRHB1Q7mS2BxZBKyk50OTuQY+a+SXlC/ffohZ2ki47tBcbGt+u7UUdRf+I0\r\nD/Aasi4WZxxwlWuEH8OA/ZwhCe/T0Unfp4hHhj7RTzQdOPToHgr6skBp7XDx\r\nlrTh6XpvYyVFAXDEpAfjKdFUvQy/WoF4pPrlEYZSMw1tucLTgkvkJjEAzw8L\r\nwF2wew4ex+aqUE6Bhi57Z5m9NAwC3PLwsFqEC4MnK1KQd7xqNREBnZgkVyW/\r\nzXcRwVHXxxgiHy9VBBWYJMnCoHev3RPNNmzQre+tIhMFWfCDrWW8H5QBk9bK\r\n1/WYnw/uZNj4wZFp9RfY1ABfyIedCJBvopR2SigmOGOkjK1B+zTLcMfbWLK4\r\nP0+NsRJx8M1veDzWXRXk1+xJZf3+28E4/cg=\r\n=JCgr\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"88311514d4c0b398c02a1ef97ba71cc7007b1ade","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.44.0_1646328933920_0.804793566993105","host":"s3://npm-registry-packages"}},"2.44.1":{"name":"@apollosproject/ui-onboarding","version":"2.44.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.44.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"146dd917a313bcc60733edb9e906563dd2910f36","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.44.1.tgz","fileCount":87,"integrity":"sha512-vanGEr0JAhM+Zr0rGJYKnnUQY36Yy35J2PWTIX7ngM3XTXpGtVQx+y7UW+DagWk+hpUDIerap95MZ24pBkOTKw==","signatures":[{"sig":"MEQCIFXBFaDcrclMDys2si9DqNXRH7gDm35LfOrR7c6Tsl9fAiBqyRYn1IM6aZr9QtXWlNk3x1SquTXYIG0WTU0MNXLHlA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":926241,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiITtFACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqBZw//YjZUUV0xRteb1vMmuhEcjlzK1eDdj6OTJfad+yGxnNO/FfP5\r\nUb+IUjSMXelJe3/zrQO6Viff1xER5Q9RIYFcBsxSU8J+hsoeA5VW9lq0HxwB\r\n89qzSbPiVoL6jhM1IgeBVajTj6EQBeN7GhJ/1CMwzZmFv4+NZbAZEJawd3p2\r\n1M/OkdfMea6wxdVX7/IeFiWeelB1wDg5VQun0PPbU9mzkHSXxGw8jJe22Xn5\r\nIVYDwnkQyP4i0cVtAA8d6mWeQVWE1cfIcdKk/1NiEfHSvCAfdwokdu3+U35i\r\nQP3vDZw0T3DN6Kp6tNzsXgQ8wcoNKZmidoeRgzItotIAhyeU1vNTmhBS3Gvp\r\nmtsxjYzRNDeuGaNR5bIjbHP22+ygaj05kQDrmaNRs2+9ZiqXnqlp1JmjdM9X\r\n40+KEqkayB+r3p5eYTYgmgSu6+xFgbQPInh/vjhT1zhM5g3mI2wCrXtOL8nH\r\nr9PzDr3QFpbwbi/J/Ss8jbXKdeeUpgkSDpn4ayIM1ul9vJwVu42jaNPa6O+R\r\nc5WPtfcl4HIrSNeSZDzNzTPlqYTDF9u7zlbAzEhaTNEEHDnHCPzERBG7sAAB\r\nVDCp0XyjYJCx2OdopHDSfl3v34rC37qOTxMmhG6g7OoXdR8xnc/uYEMB3EIR\r\nW20wITmNRxnrH13B7AX78vBlYPVhZBc0Muc=\r\n=kWuT\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"76ea66f2bd57d573af16e7464300c61be616ced9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.44.1_1646345029635_0.23557507257687926","host":"s3://npm-registry-packages"}},"2.44.2":{"name":"@apollosproject/ui-onboarding","version":"2.44.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.44.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6c8cf954f689e517e1a6eb805fe1c3eb55effcb4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.44.2.tgz","fileCount":87,"integrity":"sha512-4RU4wlTY9WX2DH4ESqCujOaRYIjkjs5tsl76dR7OXxJo7YqtHmX9jSAYB76Qrlvt6EmkS7aBf1crxUTRELyCYg==","signatures":[{"sig":"MEQCIGKghOec8ZtjmYpj2arFHrrdkE5vytq/u4125AwGJpwAAiB9+DLNLhtQYC59MOZwUit8PRDbZTi/v04CYh2KA8HUgQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":926417,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiIkJcACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp9hA//b6HcL8//4AIWYJPID2TzsC4ZUlmm7Eut2UP0zZgiNR1alpaT\r\nRJyIpSSqMAzQ+0vEK6iXzTm2+6R13QktERFa548TPVtgl2EhSA4RrtJAn7RU\r\nMy5yAsYzEyFzS29c88DO5ff2JfZQN3s1CuKAyhpEG0Cx9p9ohjTgvjzf9GQo\r\nVAH56IoN6XlNuExhulW1Vz8Ib1La2GTB5bMFDbYC9x1sMu1LVzlVq48b82l/\r\ncKEjv/8itvlR9uyiZ5vJphUwPNe11NTzuUkaodbTS35A8aAcpcENPHQHKPcj\r\n7bKTR1GWNIx7pFHnUwAtv+e7VpuXtq1H+W2yEJq5yrmKfA0QGwDZVPID4poR\r\nGAdEfOrbDxXH+XStM/e7LYM/EhIjoL7fGFi2fjFSM0bhLLzllr0v5YFsk5tN\r\nDQFzo/LVCDnjFNAyXP9McH31CYCsIXxaOYLZK8lUP5uV1kfN0JGPLDqRj1M5\r\nlB+9rSIlVYdeSO2xrauJl+l7S2iOhbUg+pVj4HgaJlCg4NckJes+8qpnZy+G\r\nBUnda2kwNPh6uDQ0hU4aOZCEpJNk5MaS/t0qTzeytomqDzToXNXpeJuOcdrQ\r\n4ZRLSiRho6wjPG1IX2Y7cFh5+7dW+4sWBFMWJGyz3CBtJo0AkPVpyHp/zpUb\r\nWEwLDnUzF4uHe9TqyAKKqiPJNHimD5CH210=\r\n=wmPR\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c0579c69f7889a4455351f8509b1b4cc674123eb","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.44.2_1646412380052_0.11583959568319169","host":"s3://npm-registry-packages"}},"2.44.3":{"name":"@apollosproject/ui-onboarding","version":"2.44.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.44.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"267627b671cac08b93b190d591c13b1f873ac022","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.44.3.tgz","fileCount":87,"integrity":"sha512-lVtTiD78MUDHdekepsbBywMLBpv74B97SbrLF9Gy12bpfrAlsP32z8T8a0i/uWtue4vUSOz9conzGckSPA5Q5g==","signatures":[{"sig":"MEUCIQDAk+hII0ueOk2tGIItG+kGU73NvahIRFpPcx3U4albgQIgAbktuW/7wSsPPMv70u8OEwbyuxD2WSSvafAiI2FDTOo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":926593,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiL1LNACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqYcRAAlyTaFmSs5V/SkdIAt6duBdJZ4jcWHhXFx5Ap7AcHSmCp5daW\r\nPiKMxYB/Jev/PwdFce/9mx+320XAifQmIMKyz9AXxWJ0zZukA/xwd3pdRnt9\r\nIoI1x9ZhNJPF5QZz8DOrD1IJHkmuYn+rxnWfKspgMivnUo4sm33qE0T8mrqT\r\nVn+1zxIr0//IfnY3hnnDSCVJMPwDn1iC8oPQ/dKCMJg5ZTR+WprKxNdbraI1\r\nDeKS9F49l33+7ZA+M2KUhh5MiQ2o8Gb6Z4EfmTHkavGYnuCa8YBG65R4976z\r\nJ8e7NYdkgX+6y/x8N/NVakuwl3aTwNuECEQgZygZ82575WOVy0lXNorukK/1\r\ntmHxErbwAOdhrFCdP5KVdVmTddZDV9kvm0DXKCfCzLmkmW6z6zWVyr1zIfKN\r\nnWr2yja8QOJY4z+dt/dbl4AokAE7oocpaUTERxnaWvXImSaKlq5ytSkf8cWJ\r\noOjkaBJbTVvJ5/vbp5O8H9/i2IF5VmcuNK6lHV4T4ZGBTZYj0T91ERuXqr7S\r\n0xpG+UpTZ1plpCIyCYks2I73BbRPga1oSuf/BLU+UOjR73AcrMiEmggH+bqp\r\n1Jy8jUdi4+iCIbOVqWcX86Tq5bUYPSar8I6tksh7Cec5ba5WJT0eK5NpiwOh\r\nZg2wfgzJajWfWObjLky8nV/qBTIt1ExoO2I=\r\n=P3Hz\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"415a1f61343795d129f7cdec8d48cf5221a6a2c6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.44.3_1647268556846_0.7366944531762245","host":"s3://npm-registry-packages"}},"2.44.4":{"name":"@apollosproject/ui-onboarding","version":"2.44.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.44.4","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"be7762bba7520029a550f6fe2b09ee58ef32b9f6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.44.4.tgz","fileCount":87,"integrity":"sha512-m7ykeonQbGEnDkrARmkbtNeHgVVXuFvK/h4PxTJOa+9zbLh5TsuqmGuc7hk/JfQI/Wl6R4Z62qh72TGx/oBe7w==","signatures":[{"sig":"MEQCIDqygqgKnuLmXLzrWPW/qZKlF/oxtHJ3fXNKQX+U8vj9AiARiPPaIrBWAArjCUo+TFB2wQnCDRt52mbWD90CNVJs8Q==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":926769,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiMRz6ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrXUBAAkqHkZDAdLFT/Vl9z9tpFv1RLenfs7p3hDg6pIN+9JNfW7pfx\r\n7pjICUBHI5+0l48Kv3L1EGXy2R+HmBL33KJbzzxBh16hZQVRBSzB/pgjVAJf\r\nNL/520g7kGrSEzztn8nF0KcmrbZJMN7FHOipvldPTK+ZFS7y8JXTDhGjKdri\r\n0TGAWDXLCP9NLeNPuHR5F8ZAXjmNDRYiMyWdgBrkRmHVrE+XLWq/xIVkRsNl\r\nZwjxBE/IhKAY4x+ZDITjboptEpDVLqZQ0TLoxPWuBJviaX64o2G07DrBSvfq\r\n93SwVPcQCYNSoXCxhJu8WG1WsYPFiKbmrgfQ9GF02hGmp7E/xvlCafHtRL3v\r\nsdI80qouEhNAAfP5blqm8SwDmyWI+DKz0nv84akbD40sj/TZcWHsUGjCdmu5\r\n5qBUDqEOokzV4JF5nCPIGcef9VThgaoLTj5FhrtYZYtyK5MFA0/sgo4kaXV7\r\nsjvxlq+aYLPKVPgWft4Tm5TFrnTR2Q1d2U1HISZP+6eUFco5FwDmIRFBHyKU\r\nqd7d6qFblWw0kQZDUFAfvpjlg10xztzVRSiVtowqvjtS04t5LTklVBolM4D1\r\n0+2MeuYfVhD57TZLf1h7/UENKilhVnbRW3rcTCu7X32LqhjGFAfW37S7zbRW\r\nKJDIhsMFAxQff9CeqZX8umsy3T70YxRnhrE=\r\n=Uh46\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"19a714fed2a52898b4eeadb46c2059bfbf136870","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.44.4_1647385850343_0.9634761326021517","host":"s3://npm-registry-packages"}},"3.1.0":{"name":"@apollosproject/ui-onboarding","version":"3.1.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.1.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4293c28fd1ada1fdaacb3d7a672a067dcfabba97","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.1.0.tgz","fileCount":94,"integrity":"sha512-0ETHVHNZ2D9NRXLt0Ht7/2jic/fplsEzMAIv57iXU/qiyMILvUkNS43WppKeyCOlV3KGFe7JQ2TOPRJYFrqD5w==","signatures":[{"sig":"MEUCIQDBowwHi56tWZ8X6otAjlcpFOKFCB5696f0xBld9GpJZwIgf2kz5YkFhi57xGkywepARHpR2IFWKb9pbz61QJYlflc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":972216,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiOfjtACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoHuw/6Ars49ShXiYc4J95tpsj7a+63MEtDSpSVsaE9MGZyT0Grfgai\r\nftXvwl7m6d3FobQiHfmH3XQ24UfTW4OaMiuu1vyUVHat9aHgCIJ4XwgXax3A\r\nLELWuEsJU8v+PgNhIWncQ7as+lXvgFpVpJw4lcE3DEovtwS9tNP+t6n5cwly\r\npKC14dGyFq3v5jfvyueCHy4DyOQFxViV9Ra3PiEJrEH9tZl+VsfVXOmRr01Q\r\nOr8yIdfqmd7W8ARUX58rFAcxirWAE63tMf2T5Z2KoSOiUEbXidNKTAD5Jg7m\r\na0dgea1fLOsH+UtEDLTfmbUeh3zGBMw4j/lqOtW5kDs6173phQEiQCcrPQXw\r\nm9CTGEjCo7u5F1IuF2ew165gqaiCiIrb3+k08tp6VNomhmXRH1Atw0+swOvO\r\nifSIeTmwmLF12vcA5mIrVwnBSzExrpN8Qy/h95bWV38orX++ybln+TftmSnW\r\nbPNLLRgn5QZ7oHTl3J9ILXE3n7Bn7WnhR+iN0n/35yPAyp1nZXakHGX0V9+r\r\n7FnnYHj+hMXSxyHZHh39ymBEf2PvnwH9LT82O6RSXCOsXPKglS8RtUKnyhG+\r\nCJiL+M7pupWRv/t/Ze6T+p3QcldYa6NjV98bP1kSrT/MmrDu4K5Tp5/M8knh\r\nI+GZlDXorfj4ELUtex9pDoGMkNOfC//9CHQ=\r\n=ywIk\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"44cddf09699908cc46784743cd96ba57782105dc","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.1.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.1.0_1647966445569_0.5578678910534203","host":"s3://npm-registry-packages"}},"2.45.0":{"name":"@apollosproject/ui-onboarding","version":"2.45.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.45.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4c820dc3272f88bddac30ca4b4e7e27ae5540aa6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.45.0.tgz","fileCount":87,"integrity":"sha512-TJg0bFH87rExUuncMIWvu5rMqTrWew7Zu3jSJ9ktdJNVTxfx/v5QMU/B5N2Fc48qk7smukqDqwPuoh1LLldbeQ==","signatures":[{"sig":"MEQCIDNVaIJRdsPeSZBk88A54k9pROI0rHE2Y2AJn8+xWZjlAiBs5wDDI6TinGYgGxBcJgMNU1KsjUdmy9qFuiH4+pxGyg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":926944,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiOikcACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpG9Q/+IMwXXv32DlZH0/6v79faQ1HMlsO5AGZW314IECRU0XIaEaNE\r\nf/0VYZsliBHFcIBMphUoGbhpYJEQVyIKaN13X3cgggYCbuKQgwDoHumB8jyi\r\nwQ4yRU8U+SpLY6PzaFBZXhVX21q8lBQkfQF82vCfza66DkykBkGzGKVLayTs\r\nlAOVdv/QQseM2xDltk+Lm6lxrad5kPXw2Vv5RAsyr1JdeuGhiiQTfOkX1H1z\r\nx2I1UQA29+rhnQErXxMRHkXyJRYZCE6u+xlnTFDlWPlbTHgUID6vyy99q0/R\r\nRAwmFR8oX//5gK0b7bRX1ZJJVtXgiCnIFT0h0qUemXTUw9ws1icS96EtE8WU\r\ncXEpqFODAEVylqf8KOwS2Trgyb0IBjAAo3Rp41u6fTSBrRCa6OrkUWYibI8h\r\nmk/rvDy1K0NDllNLImq0zWR78GoXa1yzsyMloijbp5laiDc1xokxcDOpjStb\r\nJ5uCxMV750unxBEW0b9sV1xDBAkvwSCVQ8igDnQ7XJVEuTdf8EIcWjCcykjh\r\nA07YrWU+bW5NTmgrIRTniYxXly7u3DX/O9O9/48xcH1uRkg/lLMceaxfOOne\r\nWWHK26XWG83CDqyV+7no9kqTErMgtno+hmu89VSsSnnwIz/KJgwziABDQTA2\r\nCt3Q1C1aPYbo7KyBmcOf493DtxI2NjWth+Y=\r\n=pNmm\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"f6d4c72358578c7447743f5d979be1600675c25e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.45.0_1647978780740_0.11826856644913364","host":"s3://npm-registry-packages"}},"3.1.1":{"name":"@apollosproject/ui-onboarding","version":"3.1.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.1.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"0ee3f2e15edc6bfe600486407b3132245352112d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.1.1.tgz","fileCount":94,"integrity":"sha512-+0VduhOLXRYTxxj1d3N4R9h1vMvpgT/r9qAGEyz5pMSUumoJC/eYW8DC+LN7kDicutEYwcYiCtfSIAN5vorxbA==","signatures":[{"sig":"MEYCIQDa913BGjvEorPZUJrT2V6lShZGD7UPv3GLb+aiq0QswgIhAPvr7MEvPjDqAuOBoUD89E09wmZg5RYn4EOGD3rTVY7B","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":972389,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiOkaYACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrZQQ//TIzdBhO6rY1qfLO+CZif3SNgiyG8JidVTMpSHj/AcEpkXZcT\r\nk0maEQFvmjemrSSkjaOxpIWuUxKr3rTKwsuzPKPbkpPeTEaOTQtPqaCcJoRQ\r\nBS/TBkbuBOu9s474U80Y9yDVTcxmgj1OhF1VULG2MYO5tPtEhonicNPFhbLf\r\nTIFq8UJ/NIn/M+ZfHFyNI89eKUXxgMpx6nbxL7fGMCC+cvdpAHncK7Y0Mluq\r\n78qjnNj1alRiFUlLi8UdKg3xMmU2NepJg4BO2DjBb2tlE3Bu61ddawEuqOfT\r\nbIbhUn8QksuR51UdSNkhQdY5FbDl7TGA2a5Gc1+MOFKgKLeRgCHC0cZFii1G\r\n0loGOrPV7ylAtYTT41WpJHXB2h4ONTmkNHXX9zb2Hljdm1Dxw5W8lhOk6yCk\r\nxxS6pdvCq/ObiSt/UZnNSIkhG+T3f4IxTZna3gZzCe/juOM/z1RKUwd5mM8u\r\naHkQJBl37gsp3+E+4j1bSojEbx5vYOQ6HQJZ7+UEhxKF5Ds139o8YPbcjvIs\r\nkK3qDmewrUmXMQv7CeJ+bQ0YifGWjZsoe6cpzWnkGeRWH8sSt1B1rsOIgbxx\r\nx+cJSMKUiHuwp/QFgXDO6sFE3ZqFG8LLLZJk6jiS0NhbJW4fqhHq5LNezXyu\r\nVDOhX4GFd6BR7rP70S8JT7HjejV8mTOXqMg=\r\n=u9hI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"6cbbe4ce3d717c7d54cfbcf8810c923cf3be1cd4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.1.1","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.1.1_1647986328215_0.028447113477788166","host":"s3://npm-registry-packages"}},"3.1.1-canary.1":{"name":"@apollosproject/ui-onboarding","version":"3.1.1-canary.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.1.1-canary.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ce34319015cfd47b38790d173c1e353ef2ce7cec","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.1.1-canary.1.tgz","fileCount":94,"integrity":"sha512-hyx7vAsPqIDVG8AFCGJL7allto8XTrxQwSRPtKM+i+LM6sqcMyaNUugE+O8Dz01+Pu8U4Pb9G+18ccalqPJYWg==","signatures":[{"sig":"MEYCIQCPabz9078v/uurGAogczEcEXde2HeBwGqQ0QtTTn+3iAIhAMfuoyzCknr+2IvD0M/lR+TX7T03FXoU/K92CFDo169m","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":972425,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiOy3CACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqhIw//cF5Yc+LQ2lH5O7r7HiSM5QdaCkbWSoRDFFTpv8pIFMZYtx8G\r\njI9v2OFV4tS5zg1aKXfgzO3pgF/1q/iPDKtKVeFyy0n20t0jeSAQEPs29PJ7\r\nnbNhp1BsaiEIACwBcqo9TSHeQPDKp8RskJ3XDU7Ub6rQOodqEfATloy66Rqy\r\npHJyHoCi3za/xHl4CUGo2mhoIo7Yo1+Nq4za9pcKZj321g2j59batQ3cSRAw\r\nk6d6001rSn8XCVFzF0rf0A5NtxBqFqYecM0m5QaKyWE1bHu3lcoUjPkBzGhZ\r\nYVEv+qlK5aod14sW5sC19URo5evawITH+l3PB2slGgrI0CXTzI4O8HcMDwhP\r\nxnYzLOg55pU5/aJS9Yj2oxy1awwM2TZidrl6nRFUeqQc8EfEpYwUrP9W02MX\r\n8bW5siG3sx5fgpYMhDY4jw54ZIPNOD/IZXxWigT1ZKC5p8j8m0dQD+EPIRYg\r\nvcHIZEtpimzfRchrNvM7XH4cfJSjBebRW2tZpkWvOcXH5gj2rj51rzLEBeWs\r\nmt0R60whgoRxL5/y87TdnFgWo0G5ljt+VwC0gMSnvi53/POwfqS4GJHRIxoY\r\nvFgCK3gbA0xi0SDc3wyhS6DVKmAWbRYv8HijjkzaUqd0JGSXso5LqsH/Hq/I\r\nJltD5pSKoHgThf0acolcz2Xi04qiIzNt4x8=\r\n=+LvD\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"908b7f9b25ff75abaf6dbee733e0501f46ad9a7b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.1.1-canary.1+908b7f9b","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.1.1-canary.1_1648045506028_0.11972400074083556","host":"s3://npm-registry-packages"}},"2.45.1":{"name":"@apollosproject/ui-onboarding","version":"2.45.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.45.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"dcc0acbc00e9db8a3af860040301c2c76f63f0d6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.45.1.tgz","fileCount":87,"integrity":"sha512-6JFQ7JCp5rDKHDVN5C1/zsuIuACEqhBeqmW3ROnIMuRnXKo2TEoYnsNF0oM+l8Cbko97s/tsoay2Min4YYdVvg==","signatures":[{"sig":"MEQCIBU2yGOOGxZgTEVh0aOm1i7NHaJWGHQNO1bjLmuhBTL0AiA3wZkA19ZhTqXX5AYnTHrCy64cnk7iZe8cELLjj5VcGA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":927120,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiQwp+ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqSQQ//a6rpMHT25bAXJW5XMxrLbZ6ouDflr+ESvBmbR3d/2dL2aDoM\r\nq1FEvelHDlsWCvWUgBP6tfkU6URXC2nGve4Kc+lGfwoVW0SHNdQuCKyzApYs\r\nnqO5PsXjZQYTO6rOZoT0THJfagswnlZyAVGpPfDv5z068aJe8jVupP8Ojjfl\r\nNJReCAWYZpYNX44Vi0rIuuSX+1uIDn8rhtL9bliDb4OqlOo0FeaQHNsydgcr\r\nufxrIPfnYiYlBP1tlYW4bhql3P7HPrIBwBHSPe6cvUn3bQogzmZY+2+7dFNO\r\nW7vcaqlnfxifhmhu01pD9Cik6FoitupIV1ZXwXMqCuKmPCVXPONm8UqvsBvd\r\nPuJL56SNhoucjvZTOUe52kBpqY+ZRWQxiPIL9UISPxgeuWKoLHW2OGFVFHSb\r\ndCde2QsjzaHwgddXRuBE3e+WJUl4O8yACNWp7n5RAibOOrke0StOypR1LKYk\r\n3O41sOLEMlzQg/Y+xs9FTbLJF5tRccPPi1bM9hPOaYMIyxEFYnNLEeAPM9UQ\r\n9zvutmk6q5w+pu+jWfSsLAs9J8UJdwRqXma61DbNLJg2d6zkqR4QX3X7tz2V\r\nuDmPiwwYyq0+3bZNTs1OA6uSeugvvlWiP5BdHmufwuW17hC7hMPiJ6jhVjr8\r\nMIK0cLPgN3fL3zu6UyjIp8KMGTI0y1qKooI=\r\n=kIYT\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"61e7730ca9f630dfa0e8fe95731cd911628c7f9d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.45.1_1648560766265_0.4340351417485142","host":"s3://npm-registry-packages"}},"3.1.2":{"name":"@apollosproject/ui-onboarding","version":"3.1.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.1.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1aef6bd14a2b28f617e7ba354558488664523394","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.1.2.tgz","fileCount":94,"integrity":"sha512-Wlen8a634Nn1tl5fRPs8qCOGD79enb/RiIP2tUBD/VKA7fD/Y6wLoPkHwzb+/V/I0Mte34UX+zLGxQgspG1/8Q==","signatures":[{"sig":"MEYCIQDtus+jrTIWo7xol1kLolD1CtB33ttNNxW5c1VRa7LQVwIhAPsfZRL0pEkUH1wNhFfh58mgEvr6AjPRgvaCZl5vgSkZ","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":972562,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiQyJyACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq+tA/+MFLAzDjh8iKaaUP9nBQAzWnoxS3HbVBs6XDia3Y5ik+DIxfQ\r\nHDt6SrLVDtdml0lNyaxq+Sv4Zvd3/D3OYu5fm/QwPLVmsYRN0plGn7VgCV74\r\nvWDEuXHLv7prxxt7QCSdXTolpNhUn9gvLKIg8K4tzgLZZQOmToIFWQs8VWFF\r\nVfbWzJmd4EvRyMgAYrv2Xj4aWc3tjR0cpMaU6UFjW1elMnhEXhLCQkbBq67+\r\nigAI6P84fPfptRzPK7vWzL5VE5fblx4ALFAoegx8Z6spjRXIWoHszun60QQw\r\nn/g7yJrAge5g9HeyWGn07xvAhlZdKYt9A04BwyQ+ge5eeO9P1r/xoJO30LxI\r\nK1HhhjLgsQ9oLwfQQinoK9bd3RRt6rtnnSzerrqVSpm5xe+7BI3bhORIrSIv\r\nVzkjOreBBV+md5VyjK1J8zia2tU5X2poLBNe0sCgTbpJNRmHDILV5uRfbul2\r\nlkcOVLUTP2QsMGTTYB31RwGWx7C9aMipkTuiX4z3ZopwlIfaDiIgd6GK0wHU\r\n8IPBTh5Q3xF5MFbJjcbWDGtMpJwPA3WejWVIGfJTUAhfzHsXJ0N35NLfr8+M\r\nyo3Vu7B3YTJ1XTQ4DdfzQWVenqq1PUC5JwuLwBhfIfutADxlVeoRfjXKqVNV\r\nbKs436rHWfgMRJWrZkE1S1E27NpH1GqGa7Y=\r\n=DgXM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"8c7962123b03bbffb54794e470aa4284e8228adf","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.1.2","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.1.2_1648566898223_0.7933874401843353","host":"s3://npm-registry-packages"}},"2.46.0":{"name":"@apollosproject/ui-onboarding","version":"2.46.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5b78406dab8176cd38b1321f32169552ead2fc5d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.0.tgz","fileCount":87,"integrity":"sha512-avoinaq+OFTCb5Z/QWBCWDtKNhVHe9xMV/WHzncD4rh7pEPEGroT+vHXKjMeTpeR4YG3yv+ktBZgzmtQqijqsw==","signatures":[{"sig":"MEQCIEPuW1DOFDmAzy0HCeJkX00dXWs+R0ygfy1437FMwAIUAiBUH13rSPGvL0Rx5kBBz2VxuIFf6lj2FGmrxs5vfyqupA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":927295,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiQ1AXACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqJmRAAhIMcx2Z8s0dE1YaQFDfKkT5Z+oE9JwqloZ+mb0H9pLuKgt1L\r\na2HiNPw/kJHiaJW3K2e6wnxDnrcvqEWT3kN2Gro+ISAV112VlX0NBhRx1/Nu\r\njzJn/pzRRNHXy6JXSTL3qDnjBNqGSsqobYzbPrbJ3LkelmmMSuIlzPRBUHLp\r\nzksHeDxMwE9QdKKBxTA3PtBvl658FAH725Nb3usOaVlAHSPAAsTR29zQeoLZ\r\nSP7vXsvCLkZM7L0GY8MweC2dY0tieov73x1RM5Rjr015SZlCHk6//7M0QIMX\r\nKB8SBi5f+7rFjvpNf26o9lHFnPJe/A1OwdiTp9mvv9FKusn44GOywM7UBTN1\r\nSeFatOAG32la/t+1Qtt9uA6MpFwZ0bFH/ZAsVOmaSByzhktVtxk2WRKlQpOs\r\nWDcFCtsPvSVjpS92U0QkWm2QzKQKgHD9+CnSrFNfB1ApeleLYEoXX/f5HnlS\r\nEIp2KPfx3nJfljKnTvk4i1tOwhWoydYw1+MYe5XQnmPiCzfS/DQrUI9qsLxT\r\nPT59IvKqqOx7bqAGjPvilkcE28/fB3mjA/8clHTa8JD9vIGARTAX29csffET\r\nnznp3FBIYpyXpTe3JtNMVsa/TlULjr1T/89ha1jnAgtAKTJktVgufI19gIhl\r\nDozC3+GfNzQIPoxKjLiESabpGIaFce2b+MQ=\r\n=qUJ7\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"1b53b711f6723b9ce61d638b0600731ca40b3a27","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.0_1648578583325_0.5394734480149088","host":"s3://npm-registry-packages"}},"2.46.1":{"name":"@apollosproject/ui-onboarding","version":"2.46.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7452704514f061750d02623ae17145f3ec0bd28a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.1.tgz","fileCount":87,"integrity":"sha512-rs5SaxGdeGPp23IlR6mhpRt+YAucfgV2M1MHsY73fJFUvK4hFeXKNRmA1qEULgiKWcGN4zpI/or8EQ1uyPRVnA==","signatures":[{"sig":"MEUCIQC8E5ebPc93kJgHUJ/cGC1RhFiiA3oGMLfhEjqNFGhvDQIgX+SMefeE081/KyYO3PWswTcfV2wVqNiuQruT22ns/dE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":927471,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRHMFACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq9dw/8D1GvfyX2DLUez3xEfp0MXjrCP47993Cn+gcArCurTa19io7R\r\nyDagX0n9kwZY9z4Hy8z0PbAf2cqIPT158ezF/72JTH11gC3NaYtmgmfAxJs+\r\nmzyDg4y8t9KCMMwOGKxsMe8+dCH2huLTSE1f0c3LMeQTJ/G3on6kNDNhNPwN\r\nq8D+8sVvJQDX9/4nSPXIbqaZw+PQpL8GoMr/9SY3YqSi+GKGP/Jo608ZJnQ0\r\nIREgRlEnmtYKqpWBv0bPQrehg0JWf39eEioZ9Vy2207qMAlKywNNxd1VCPQw\r\nn33WZFBBjWIhDo1j4Ky4l/6ZBXyOV8Q7ee0w/7M1rXxizD/uJdStMY7dqhzg\r\nHhIreVJexMvsvL+565eZnGGvrgXGBZ6WHpu+sQIdC4ByMFPik3ft/F0CRyun\r\nIXVd6Yyqm5GGNoz+yawiUu62ikz79q9d+FKVLXjlMzrbjx4a08kiXNy4DZyQ\r\n206EzViUXz0FdMydmD1fU21eql5chsljRImcWhI2OFEXo+C5KLov4iHolIww\r\nMDu8LvsS2De+bIC4l9Yza4b36+6B5decG1kIjwJTZGahCnjJtxzXi/f8/1CL\r\n4zqYPFHrlFPaGBkZmj8VuEzT4RzGIazkTo3YHyJr2DjhBEYJJknkOu01nZ0O\r\nY2vfPq/wOD9OgjoruYz6LC83MoCnU0IxhLw=\r\n=kFNO\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"55e1f2dacbc58e6d9d7edab4eab19987912fdf83","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.1_1648653061710_0.8133224695755346","host":"s3://npm-registry-packages"}},"2.46.2":{"name":"@apollosproject/ui-onboarding","version":"2.46.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d8820151c2bd1ecb522640e69923702509a5be03","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.2.tgz","fileCount":87,"integrity":"sha512-Ij+TOyNAdfjP6r+64Rjp0d5WclW1nY6CAV3q8AQyfgCmZ7yh226Ox65tG4vLJtSTPuBO6SRmhaIRhY0Eie9vrg==","signatures":[{"sig":"MEUCIQDXShf2b1IXZS8WR9ji6KeHO+YbpoldY4pR+64JnVtgmwIgGouyPkidDNz3IpOUQbwCNeHeIzZfBLI2MTP1T0QCYVc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":927647,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLGDACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpkhw/9FTFznWhTT8q5Bqx4i5wFV64ke0REHYNNcQozVp6dwU5cNqDZ\r\nJKcmAE2a1LQVgg/XRL+1++Ze912sGHMoFu5UOFx9eSLnBBmcgVy4H6DnxeBM\r\nKCIjacPnMixS+eS+B9EzrvhkVRQPXhz3HpxTKIfOYjOUBcrHAbSW52sZ0E+T\r\nD1iU5O+Y3iQAPaWDjhnAABqtxhPqBSxqLVdKaBkyez/OD0IOTbNHUXnBVniw\r\n9UV+0hoXo6+mc8i1EZjz8rKCEaLypVm0s7Y9Wwoo97xYQM2+VRF2kPGvJS1a\r\nfo0bSpxDGjN2Z9rBeq5ejaOk71UdIEdBEjp3vUhlV7eCeaL7fg0mEU4Q1/7z\r\nUgPt+2VSE1ui+ppMZDOHL8ybRrNMSEXb4kUxnOL9OVfPl615tCZul1l8hL4P\r\na7V5xg9DJwLTuMhq1t2HIwK9DXA2lD2BRIBjVh/QckBmZ8tL/Ga1w6SDPSgz\r\nzH6ysR2t5ZCtjjYDYzkkAk/57V/B3/jEn5UeeXe9I4hzg+r1l/RfHMcS16Pm\r\nO4XzRuMgFFwL7kbCJex91Y8NTF0zEuKzLqtBXx0rmqsTDzMCMh3rj2oMyPVO\r\n9YoVIjZKS1PyeBitHuDlaEmWc97K4SfDvlIqJbH7cOmUDZyBaCxJFF4ZeQSH\r\nuY94pJagIQ/iTGQkEF8GExucBvB8wNbOeCs=\r\n=LRwM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"2055046e5cbbf1fdbeb484fa1c6210d4252a9021","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.2_1648669059315_0.31325979515211544","host":"s3://npm-registry-packages"}},"2.46.3":{"name":"@apollosproject/ui-onboarding","version":"2.46.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7a6d984d118a5a37b0ca219a0e063870107e6e70","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.3.tgz","fileCount":87,"integrity":"sha512-yAdOxW1Nar8Gjzi/aTbqFG2JO4Cj+HfakXql1ZqFJD0jXRKb9be1tbLkYnUTt0cDC3Jwbuz4HAwKlPXoBhWn4Q==","signatures":[{"sig":"MEQCIGvs6WpppaqrjY4jnhbgjMiElPJlUIRw92daj36IBouwAiARlYCwws5sfHoWhTYuTyg0kJMN8+LDRT5MqqWoQ8NqjA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":927823,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLIpACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpHKw/8ChdsBZyKAX2bWYTbi/CMChajsGtpn5/JuytCeokVp/kaPMT2\r\noI8LsMkb1HaCdhf72SM4dkZfBdoKwpOQHoHqX3A/2+BzL9KCTPaopSrJuHnM\r\ngT4YltGnZw2N1hqktJe2wUfmCEVV2+N8E8cHXRIeyo5uUjvyorRk9OQkSqi5\r\nE1uIa84WWci2n7bDrpsplRyoQRJ1dP1YdoQl8DBZ1+mMJfncL2+ctlpa341v\r\nTjqmUqN++RloGcRLYRzlonsUZEnv/KZ2Lw86SZAlJLFahKLRjIYcEANGCX3y\r\nd/9y+tk06JwZNSbxtAQVEP+89dyuW/6DDUJUnv1GNS86OavBhbL+L3+OyeFh\r\noYmvGQk8riOqcbNiPG1GvRM3sXQUzeMGAqIPMS2ClCMEVCqP4gFBwvPw2RNA\r\njbQcpA3Gt5as3k7CUWv04fPsO8KzRBo3w4mgwEcboFPe/4SpegNxNPXGVTW1\r\neES8/ui+PlIbYHziIxLyUvA4PHbmCKr0XZJJWxiIGFyH1XHyjFvPdRKwjKaC\r\nhmeiTPSotoEyYkdA+gSEhESSmEaeqtiUEaq7SMnHg0SgVXvejoM4ZbSCMbAA\r\nD3QJkaqqqKspzvjTyxOmekmXXDb+JwURe7uE4eA+XYVI3BCLnYRvzTvsLpJe\r\nDbtU3uV2pkseEQZHQ/CngmwSCOkI/y1F9FU=\r\n=NbkN\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"8ea7936670611cd8fb9c4269585f37db3c66cc6b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.3_1648669225550_0.9554518684437636","host":"s3://npm-registry-packages"}},"2.46.4":{"name":"@apollosproject/ui-onboarding","version":"2.46.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.4","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7179f37b5e859372807b7a72a4227392a7829b78","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.4.tgz","fileCount":87,"integrity":"sha512-QLjdRAHmRW/eS65JGUI4Zy1MnQmIOImreSe3Mn5dbkxb8/D2hxSnVGeCKYtHuGVYWp/JU2vgpq/YAv55FbTTOw==","signatures":[{"sig":"MEQCICeDrKpJNXNXwHdlksVFHkQKy3kEVAkZwk6Jw9gq7XGoAiAgDykB9Klm7cS5AxaQLLX4Mvm2pzwaM8q4xWPKCj7KPQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":927999,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLMKACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqqRBAAnlZ/Z+vfo7+6qWocRXdp5/Fynd4DtuSTqO7p05QUDidn5i1t\r\nLtTJcVzEMZGuWcIpKXLnllVxFifzCkPsBhkSfW2GYjqVPxMHhjrGb9/sWuyI\r\ngyq6DMKZKUpSgLNFRrICqy8eFxSOfFPSA77wb59peqErq03NpST5iwnpOOP0\r\nzglcwn3rxa+TF3cjVwqmYevYPPQPcznI5VeLMaH/txIQ0guPS+E54QkNHsZw\r\nPD/ixkxh58tkJSMVxgWNzLhwO9hubbwpUsBw3z6gdFzmhsyvf8vcPzUrv8WB\r\nUdY0LVwbwVL/jKijjy6UZYZWIn7CT/1/+25K4751KXPLh+UtQYs4rLO7Usy8\r\nZgajm9g9shmm5tkYtlE5qa9hOTyv7loKEoQzYbPjMPYyfvCvLGWv+sIH0CAs\r\n9tbWoWxenT2c+QRSi393hl9Pg9/fM085khpyLI70kSHZk/is1fcpbpJwtZ1w\r\nUxAQsXd1FUV8079EngjCxBodEn3Jf/7n1DJTIgpGLWnRtZOwtCgO9F3RrUBu\r\nE2CT7BhHVoQYNagddotzPWGdnj5yNcoiLsubFbIfYojXHl5B6sY000le4RWc\r\n5ShtFkbl2da1/ej+459eisZg8BnLydarrO7wgqrHmTmvcoCWwHf3nKBY/790\r\n6tj54WPTuHbQE7tZzom1zigW8Fz/Aneo1Yg=\r\n=PCWu\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c48583d94569acbfaf3c8565b45df0ba7dc19830","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.4_1648669449974_0.9997626683776033","host":"s3://npm-registry-packages"}},"2.46.5":{"name":"@apollosproject/ui-onboarding","version":"2.46.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.5","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4361d73a482f429cca99c855d3cf381785a89555","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.5.tgz","fileCount":87,"integrity":"sha512-D/PZK6ITVyJd3lCn0DSE5evre19lTLbuOAGkQZDY0t2NNFrTwRgserO0Vt3lSmpW9e4RTmTg+eGse2g7GTWyCQ==","signatures":[{"sig":"MEUCIDcwbgjtQ2sg1Au+oT+WELjk4mOl3zcOs7x93DN0/8k2AiEA/4lHB0/4ifDvxWnlCsZ47vxocl31tfbSdBUzONuWlUA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":928175,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLO6ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr8DxAAjA2ybWL1OjuGxb4aFnC132Qf/BYKeECpnYppoFAFLACMxiTP\r\nN4fO6yvEVofd4FW8cEyvnCWxj0o7b9X0kdxxNGAbhkav529dVlI4T1yrNSPN\r\nMeY3m3yDinjd6FwI6eyjIeuTp6PqiQDgDDMAIeE9Ga/k+a7RKg7QcNns0U5P\r\ntqvrgaY6B6hHy0H3+kY/XP1SWyXk5AhKNDOn7EhcgWcWEaPrM/JBBnX4lojf\r\nXSLVupffqUStLZVaVDJUDuiTZbXQv7E1L4fxjFScXfViRuZFnX4VD7QBG1X1\r\nnva1rjX+ELga8Z5N+NUxFsrT9GWE+qbr1DM6O+Znbv0FH87PEGdqD5XhDOuV\r\ngfv0317Ck+zGWFUGr0debK/qZ87QjOQ+/YNqnYnLWq9xdAJP/xje81ZO3PDD\r\nYJAaJKlChMXe/bzBs2KhmG/7r/IUeCZP4JJT1UybOPegt4jTXnlZxjwvnBvs\r\n4dXvhiS8XrnTKxjLbTOcD+ef3BWSxzYWfL5SCRNxEIQRpI+8LNS6BIlFUEhT\r\nCZu6tnI1sp/APX7Zx/xxdlwHLu+5edWJBkaiumG88SFfmbMAEGGSH7opBAtO\r\nojb/eVBh2Sp58OZ/NS3RQLbi9HOI3cFP7rtW/bPH5xFyPG21Tzt7SsxNSBXj\r\n7lCkLOV/K2lHwlwXMpY7bMXYTAkFKe2OiIA=\r\n=utSv\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"b08250b53767f9a1bf580dc74cb59b2ab3c68f96","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.5_1648669626564_0.9884698862282568","host":"s3://npm-registry-packages"}},"2.46.6":{"name":"@apollosproject/ui-onboarding","version":"2.46.6","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.6","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a2092710b3ec6cef0f75e026fa5af0d43960982e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.6.tgz","fileCount":87,"integrity":"sha512-IqrTyzhoGipcabvh6MKirbydF0T/3Av8CdOkg2gwsBn/8pu/67PWCxk6KNcwwdOclmABCkd6Nl581ZHbqEI2Fw==","signatures":[{"sig":"MEUCIQDuN1gYtZXywE55gwsqzVYwKur2MNzYHp9NLocUg+friAIgPg7OUpo+sSItmlMC/bjcY3VtptuzIyU7fPQb4zaPg1o=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":928351,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLSUACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqjHg//TxN0NkHx5jGcFaZlAz18qJK8pIUWpRBHzVT+1MMlczzpu+RN\r\nIpXY17IplBbiLxlmEro0R05gZkckz/xJyIZZcvlZa+vITgxvaFX+3q4cAQDJ\r\nrKH5xCMvFnNDO7/7thZqte9rnjzGHQRPmPM7cvNxAbiBhnMQrxIf1GTWPhAj\r\n9iXxOk2Wg1scxs8keube7ZPega4fyN5MeTZ9ccyBuuy4hrxgYR2LbHMiNYOY\r\nf4mVttV4HhLd5guuHm6X0BxuiwasPs/GTs5zLZjBKbo398xzBrZHtewe4VRX\r\nQ4gDitCluTKeJHConTiFcqJs3NwnP6jtdqaaMdMUKTXVlr6V6xmrXNZykRpt\r\nayXWhlxOC066TWsBIyyuxsuFMlbbDZeBkIdWomome2dI9CAiPagUKrkPy5ib\r\n2PGp30ssHX3GcU+4qwmI3ZU8Dq3U75bVUKiCBl2wK63eXbrpgo2MZgEcTjTN\r\nNGaJptjXKshxzopRdbQktc1yrup/CDSkD3kRpmMj29c7yAADcWEzZNZHWXaz\r\n4gjBKnTF7c5eLwZkg7Hro/wNHMVV1uSDU4z98z5M6XrDzm236YUM83TvxC0C\r\nTTi1pfo1lMu8hIw9Y38tA/g7FGhO/fg1/6yCBGGPaJyV+exvnuUUAb1uyezZ\r\n0V3zUugQ3LITwfC/2wRl3RchHWX27XHeEno=\r\n=59SW\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"769c125f3919a1c240f8cef52d37e204996f7167","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.6_1648669843926_0.2374200787009626","host":"s3://npm-registry-packages"}},"2.46.7":{"name":"@apollosproject/ui-onboarding","version":"2.46.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.7","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d6ca49fee48b869cbf6bf16ab8268c0dea81c894","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.7.tgz","fileCount":87,"integrity":"sha512-fvZkV0cD5ww4wDuK3P0DpagNelSisfZkg2dLP0a6DJi6ToGxcAKZyA20+bqaJx2lA77tKVOHripkGRNwyi14uQ==","signatures":[{"sig":"MEUCIEqZ3k9Fit+x0TZBAjYPbKi7jLw6fU7IzWifsXt2gmDqAiEA2y2lOdwVk8Xohj2K88VKfa2gHObvQZj5oE3rB+3rGqU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":928527,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLU7ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmppahAAohIaHYF2CthXgoLkFuelbBqd7N9DR9S7U2jvGtz8Fs6Ewn9V\r\n+d5xSp6/vdgYv7iYGDS9a8QX5pvhCNrSLeXsuSj2USUzgYLk7IVNB1Hmr8W4\r\ni8jVNG6U5LPqO9P04arPVuXayC4rnfVgzSUrX01qzqpGCB2QpPLqayuKkdST\r\n/T7r2PJUVTcWx3BWhz7f0XDfA7PpNvSonzk1bwHrAX7e0JWwVkjAH/RcAlq6\r\nF5GCDfucbanO/TEnrcIghhOv7m/crgTgRyYEH5iddGbPABCIdmw7o0D4pVOw\r\nZ3Y4xt/QM1JwZnRGNwgEziRaZCfyaVkemvbD6OZr603PnKNzy2gDmWHdEaR5\r\ni1fTODQIECrRpX+ivz8xnPhjZON6RUqLcAXcPUMzkgeRbbzcvmJZ/VCv0LCR\r\nn0GnLuK2K1Bqa8X7dJU8zSQakClGpMxUZf7Kvt9bztepo/1Rl3yBZzGbQgby\r\nrB2fFOhfbK4Je3Kw1dFLW4pG9HLjmmczYcx/0vDyVsH3h5Rt8a9vzb/b4CBt\r\nCU7KXkiPGhs2xGfg3E3Z9Kd6nDiLKSIM4Gee2o7Ze3Rvg6UEvIdu4BZm+gqc\r\nNstaT/DD5/G1gYgnhFLDe2IGqjL2rcnD5kTFBdTwTueDDCkTQmgLdL9/cn+j\r\ncbd4tXgvicY2uLDCIgVSsMxKo/dC5GYnyC0=\r\n=yfqy\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d5718a003f67a961c5b03a967c68a9e0fd77f840","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.7_1648670010645_0.011666048040324117","host":"s3://npm-registry-packages"}},"2.46.8":{"name":"@apollosproject/ui-onboarding","version":"2.46.8","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.8","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"02bf57a7b98f404e25a98bda3edcf494d6b39f29","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.8.tgz","fileCount":87,"integrity":"sha512-AsjQQa31hhfvQj+NERy3ewtaQJ1TPgSnlS4PV2zjW06U67Uja5zMDDtGdzypekKe6nasujdIQ2+69AdNEtVtSg==","signatures":[{"sig":"MEYCIQCKLnxg/06hwg3RILL21GGdjSwJTFejMfT2c8nxxvRPfgIhAORh0W5+q/ABE4RoFdoVEHDoqz3/P1/o1gWsgyy2+fDO","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":928703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLXQACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoD0g//SsHXy4dMwLGL3fgHUTpjPKPR3guRS8Jncs1g85R6SBelXaCI\r\nTH0bTuYCRpvAYcDQSayv13DlqSdQL9JdfSppxyjAgk4SVxgUTbfFU++Vkz0o\r\nehbHnevznHaIidlnOmqu+dBz0VrpqLMvOa+9mgyQOsIiJKDlyJZHlJd9UPKT\r\n7AhtCZ5cxVkzAy72AHfSm7dWie5MPZb+zdpX0QUz4O+0apDX22nTqt6S0LEn\r\njw/EoOzNofA6kJbRPDiBw0o3Vtib3ue2Hpp2FUdxf7kJGj7rztFmkLAuj1hy\r\n0x034OLpV2W+KHj3+0pcTcOugJ31nF7anBUN2TdZfyCqL0KfRCgg8qM5d2zv\r\no+XRJ9iWOvKgQM28kYnP1GjPjthSLuW6CkqKddf5yNVE9iPUKMAFMyu8OARM\r\naueyylHL2mgFtD/yOt5G09HteWVC3ZY9acYxX4eh3M7iKCkb9L0DiSdS5k3p\r\nlBm30ieFqF+gp57DEvk9jmjBt/D/51KYZhgdPd37XDwMnbiIIZbf22H9gGMK\r\nXGstD8nIvIeZgKXoPX61aDBTzyLGZt+8CVjUaL3wegnpK9lQ7Za6q49yNctH\r\n/dnY2mNSvyccekAMc3Kz2ne0SE06uckVybCMT6/DnF/dRb1auejcv9pV/zds\r\ncLUPc5rSvrhDxOrLdErZBnUMC5/BYosDvZo=\r\n=Vobl\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"060359d8d901806bf09acb6302fbf35241b10241","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.8_1648670160014_0.40035456379842094","host":"s3://npm-registry-packages"}},"2.46.9":{"name":"@apollosproject/ui-onboarding","version":"2.46.9","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.9","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"14d71ac38eae0c76ea3faf82d43a5119b4e20d36","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.9.tgz","fileCount":87,"integrity":"sha512-4hNuxQw6iNczQUWSIc1oHC4QCNhF9R5wxW7+B1SBpCJsW7STDcHF4FqXhRqc7nSX7oCIXN1JAbKNJZf5R8x7eA==","signatures":[{"sig":"MEUCIHgNf5/RM49fJrinSN3EXn3o/nb95SzWE3BshaLmwL07AiEArQcTOdV2e7tYf5SCqxzKbvSSWn8qOy088OmOpKqp9IE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":928879,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLaTACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqJiw/9G7lD3wOGGvSKi6LMOX8eopwdYjkxuoJtvYgrSsxb1VBOxjIh\r\nJHrBfPBbvQuKMxhpqT4RCiPmUbVZQdsDycXN1x/PzDs8267lyXmOFsz7HhKF\r\nnyhH83Q0nE8+wyaIRrobzqaqO+szzyuvP6NEi91gy1RAYGYF7lAvxIJ5VCVa\r\nYa61R/L9Wz8z4l2DolwwEFGX6QR4tPCYna3Jo4WJCoKCVZK0Em031dVA2jyk\r\njCFlZfXnCecXF9KNfd/GVb9prY4wPw+7qe+qghEXYDXPY/f4Z+okuQq1VoYg\r\nQMcGZrku16MdLLoDQPHzqFS3lAciVNqOo3cAiIuaB0YUyFoxZbzx2/sWO/xg\r\nuo2SAHTl8wah18WCSvejlHUlUvRzuzx97uJqYML9B57xG24k1PJ9mgYlvRC1\r\nktlFakUtMMled4UaR1ZinK71pU5hEI0O/TVZPL+aIgiNfTTtaXSZZQW9ye2x\r\nkG5I+nVztdUv3KjKwemLvYY6ZDGWgd8M4dDBr9AYr32jhVFltZyNWxC3S4pz\r\n00ua/KdcBApBQh5HDj56Y7fM8NLk5/Wx+ZyJJsDBy7XBPxYQFKMHzWucgZV2\r\nCxKZDPe0/kSsxLtf6CsYaend6cyn2QBf+Ae7703JgJeZtvlkAOKTritXuafk\r\nLW3vsimrDOq51VALPtg2LWlcdkojDDYfThI=\r\n=MrER\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ec5b83a84465b89beaed94ded0c4b2d6cfc399a3","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.9_1648670355344_0.3579093981143302","host":"s3://npm-registry-packages"}},"2.46.10":{"name":"@apollosproject/ui-onboarding","version":"2.46.10","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.10","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"146523c9c90ec9320302ce8a823bcd632c0f939f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.10.tgz","fileCount":87,"integrity":"sha512-tSaFOWaKGmEIh1Zn2bYqw0hTiNlPm8U9h8i5MYzGT7cpJqtZK8Z8XpNAX6D9f8wgcp3k47C5sfReGf9fZ0H9vw==","signatures":[{"sig":"MEQCIHbMAcMm50Fd3uB5TfcjsEVj/czEomeTjY4iE44KHQuTAiAUqwQ+01co5zT8ZmX/lcC9OOtVcOMxbicSn/6k45qoBg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":929058,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLdJACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqXfRAAky1JNSi+CAGDr0Jhr6toa0xGHE++oB/5bUzxr7+yxO7IKvbU\r\nE4VYqZEclwTbK55Os/X3bq7zYca3iGnKT2HIjCjT23Nh6jymAkMiFtFlYaj4\r\nXWagFtmPEP2EF8GSuBytW6rjmvrjCiGDH+S6AhnhcxvC60yDdN1lPX6ADHLP\r\nHO0Qpny5g5EaD8Vl5yg1ZEtGb8gGf+7sGpbUfCtEO5Pe2rdvtIX1AIO1/50n\r\npFh05MlcFz5DFKcnuB2Kypw338XEm2hNdKg8uGScXCP2qfcE9ZBD70ds9bGZ\r\nN4Gwwj2F1YLH1yt/p7yoqQQwPB0oew8A3/4GEoVrSmHJxH+8iq2X2CjxwjdC\r\nqts+VxkUkqyU+MqhKiKAcxanIxsglc+w0ML6NpiBdlBYdyVR9SrQLHU/gzC2\r\nFeI/m8QhR2GkeCFdybyOG8dMX3HNXqDel1AWyWfmRQHITTWpnLGrsJK1jQRr\r\n513TtJy+bnIRNuFX4Vdj/SMHKRFWb/uSCR1FVVJXfsFK6372LiAwKiIG0GAw\r\nOVZ7bKFT6BZkZB2CuLXT7nTxKwP3lR50AFUY07/Lh+7IU1oiVfy0tJvHGfr8\r\nOxXz/6WS5Rj4CoI5KTEW/RQAaxrBaxSrwV5bPcCBL34aB0a3wReQ1oRUU/4/\r\nwant0bvxxKpE6LV8Hyk8rVKniOsv5Bib1QU=\r\n=iWy/\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"f3a24f5bf298afd9d054863248cfe5af1ba154c3","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.10_1648670536824_0.18261080602882673","host":"s3://npm-registry-packages"}},"2.46.11":{"name":"@apollosproject/ui-onboarding","version":"2.46.11","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.11","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5ebad3fd5e2e2a6895613836274e8af3c5715d97","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.11.tgz","fileCount":87,"integrity":"sha512-uhZAguwggc+TG3evnDoBxYiOBER12leaKhbUytmjSF3IJEL4p7uRT7nL4elziDbd1QrshXXMJ3hNX/JWpzQ4Fw==","signatures":[{"sig":"MEUCIECN5QIGGJNdoCSe0Sc872iQV0Bmhk/xs1m6jaCKFKZ/AiEAhPiGUgeyokKI5sG6hb/CMafLW3fBDkoBNc0BDalIzSU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":929237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLfFACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpf3A//TQO9TDXUqRMJNNzpaeb4mBUz0jMo4CYSzHtioNEecAxXRskN\r\nyiVz6gFLCixW3kvlrCAlDaqB87xjtJiOiKRSczDIUp50LcDOuUZIoBShGumx\r\ndQgL9P+eFdPB2qsIFS4dDyErJsdba8SuO2FXlMTfsAHUYwicBgqJa0KA/B4L\r\nPuUyBibrY1HjzWU0/Cy2hCuDjltxPPXcBbPWcmUDZHuJNXlARH8KsTuh6oMU\r\nn9GZrnrjjIPWmp8PEpKoJzd0vnC7RsKl68W0+YF7B4VRZhNitS3OVvNz5yDh\r\nZkz1wYlDSJf5IRnHekFG+r3AXH1YCXd/TbiqbEEiCKM62r8HhK1ZlRMfEOD2\r\n/vsPofd42+rdg4pckFOA5LvIkOsUATdL9UI6RvXgSirfHvlwsPAJbBbvE+LB\r\nNsoxBR8OybF7zZge0R1I5yjRbzsKzG51ovNUh0uNv7JqpfAmbH0qLdKbY8Qa\r\nhWau7nLcjSrgX//VTAkSgS+JWPcbrklZ9or/8ct/pcQFu8OA4fVirlS4fAeV\r\nLvKJNMLJgzaKCeqApPBumsDc8EfHGJSeXzHiMghk88SXf7lZjfXXffJaIN7l\r\npd6TW0wGUTble/a6xSKdGWefshmh2zlM7/WTWOCSxajsLHubFgp95lIxZnUK\r\nJnFkrhgt9JTzRBe1iNlo6Sh/rkv5nSvOJlk=\r\n=5woO\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"b009e6e643b5d491633984ff2c6b24a8b6a0c4e7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.11_1648670661637_0.5205628322104316","host":"s3://npm-registry-packages"}},"2.46.12":{"name":"@apollosproject/ui-onboarding","version":"2.46.12","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.12","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"f2faa1b7e533956373c92d796199d0136dc71024","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.12.tgz","fileCount":87,"integrity":"sha512-4ZsBT86bHoexg3Sw1NyfoVD4zWz8Q9Y9OPW+YO7bCYMC5OJbdc/PePCePuJHAemf99lM1zyN114V8Mkv2cqMSg==","signatures":[{"sig":"MEUCIEbKQ8B+Jt7iGZJwJeJ6m9xqtlJpyt08/VEhbPrB3nKEAiEAqxq9hZUX4OCOTOn+1i1Gurw+qjRhs5oAm2rqvDnnhow=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":929416,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLh7ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq97Q//V2+SO55wzTpUWkw7OnY13cEAxqRObmf2By8gsJsyoao6jU+q\r\nEpVbp8d8W1tw+bSqUHd/+a7IoDx9d3FGqgW/+0m/qFYmaAYoljAsxHkriuIo\r\nC2F3SDQT4ekQPw3qdjYola/v5GpJsIDy3PBLiLwDvNC9tq+aCvOf0HUo05ix\r\noMEkJlfFf712Z9ZeakqSDMizDlPJkizm2kNKIs2MqiZ5hB3BZEzzBALAhJw3\r\nBUool6Sakfuh/Nc19lm4BqqiwgDt4C5zHrQwZ/WFCFZOKgHu3ZvLsF8j4p69\r\n1RZpjWOLq5okdXvnoE/38GTD/TgTOcFKkhK5TOpel++wKfieBvo9XbHxFHfu\r\ngb66zhP3uqDdXwNVKEKV46POP7RxsLZgJTcD83mYXZYYWPDJP7v3fS/rqPJr\r\nNB7qdhqhSmMvZGZQSSV8UdzFGnZelFS12GqDalkjO49MbHLS2y6p6pJIQrl+\r\naXTklAk3RND7imFEQiRHfKN4fDxTzERlO12EGRHFXUUjgfCyujJ3uzs6Pz+f\r\nrp7SmGlCB0tdUEDuRHh/f+HTJiAddxpo8RdVObQEUgvhjH8Hrz8+obTSi6ER\r\nPWqyWJ+gW0W2f/+2hoVxrevTmVC0+W7exp17b4sAf+0SQNwfIojNOPqOnvKk\r\nJjv5PtJnNuiDM4pjxrKf+Hgj3FoSa0dYVXs=\r\n=a1nN\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"fa8a23dea0b9b8aac3bc51bd7124f9bc102977e2","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.12_1648670843196_0.6810087732555621","host":"s3://npm-registry-packages"}},"2.46.13":{"name":"@apollosproject/ui-onboarding","version":"2.46.13","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.13","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4a570ebc38486fbe8b0a4f7ccf5e12566ca9e18c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.13.tgz","fileCount":87,"integrity":"sha512-3TqVziXZckkflyyXjfCbcI2wJTjN0EOaUdmzga+YF4scnYVv6G1eTtoJnxPYOzJyMUtSULbyBwtyN4qtgGoL4A==","signatures":[{"sig":"MEUCIQDlHhiSVu78p5Im55PsbxI9Fghf5skG76H0jyPkcGMKAAIgCVHvbwnyn70YqK76g9CFXcn20wBQtqkjn1hFl77rcM8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":929595,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLlbACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpoqA/9EarShE69nbXomaitBHHDzNPfM4Gb1lEF/sMwYxsGpRQLxji0\r\nd/sh7y9yaz1ZKmPt0LsGyWodnYAruPnbLczvk/kHr4Jh979I4yOIC5304j+3\r\nefM41f5s3XQLlp/F9gGcLdsmY2j5OumIx/CEyYg2nO9Qz6ce/suSRHAKRoW8\r\n/z+VylpB3MB6gOQJkc/sH+7GCAHuSxIMWDp4KZB8qGLSpaKmNhw4uLt0J7Yr\r\ni6dm6qFVGQ943Ux9krrh7BjiWqUOo8RBVQgfBodW1yNuKHFPSMci+uxoEhOD\r\n7gOMfO0EPwfjwMHq4gmOvEWGQjKJmN1kXdQEHBfoLW3Lc//NSxwvbHBMfb3E\r\nQg8QYrz2vVpkHuvxFGxRRfD2j3pobdFouSBPzHH0GspicwyKW8u/ep7k3d1G\r\n9j+FDJUkFewoPDBH8nq5OxO+RSuLe2c+0DFYkTfSI/ir32abjmMoHs3XYQ4W\r\nT3HrZcHV0KE2VKTHT8zRWmm98DsXhkSLLN9nrV6oQPBmD9UXSLjVE6EABYE6\r\nmzawHGsG3wd3/qFzOBI2SBE+Dte/ywKCst+MHw+bB4TeibAyvAvhWyZrUY2i\r\n09cyeVfgRsVNloZE69YehHRj985R735oT+EGrfCii1uZxfP5u+e1hRriOsTW\r\njvewCVkmeeCAidmyQW1jBDiTuz4p9LZWVC8=\r\n=uJom\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"8840495b04613d6e5d609047b8626637c2f38696","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.13_1648671067525_0.22684436794312246","host":"s3://npm-registry-packages"}},"2.46.14":{"name":"@apollosproject/ui-onboarding","version":"2.46.14","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.14","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"176385f93153b77b2557383f41cb3b3f44391b7d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.14.tgz","fileCount":87,"integrity":"sha512-9HTluLkEKUJXkrLEA7NCTyPuSyeJ19eDVU20DL76NnFKTckS9loZ3ssUoOxAcIpqyQbI2EAiHN63yqq4UzeOaA==","signatures":[{"sig":"MEQCIC0JJqlg9+FzB1nAJue7fE96q0cJZgL3JO4giw2eDaImAiB9lzh5t5QQYWUqWOYrDS45fIbsEfmGvp/IXHjHVaH0eg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":929774,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLn5ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr+rA/8DVPC9Z1YyKHjkSzXArNurj4TnpYmbrp8TJzuAVVQ8Xt9ACIJ\r\naZRC1gdynfMymb89jd9+hRYWpGTgJNQI+sDnPd9TDzErXBd1RdrEh0Ls/XxR\r\nF6XUQ7TgQKLQMfR2mfc2SdTlXaDaSE8GWJ6xctp2FNz1l9udpNFKJYIfoBKv\r\nCMpx/z+GhVjic91ZWYSj7FmgBP6PBfX3JykToaWO0FDhpSLi/vPHT8uy2W2i\r\nRUHK3dURaT+m+5Y7flsq7UUHggb/t/8pajvVh0mPNoSsemx2tLSSNDbNJnME\r\nEwb6oBSwg9f6b5DjHEbuwX7DRhjM0U3pg4bbxnryexRvoNgEcguYRHtfHiJh\r\nWkdNg2Oo2wZ2tb99cvXoNLnGCv1DXkLCceGGRPQHBcip3ccplC/ggq04iDvd\r\nlsGgkuOkTfCZnL0Yp9kqS+d9yoSfUd1Lt2BlNPm7vtedOIHAeBGTr8CL6Y/J\r\naTt2dSfu4LZdJLtSw3XXAJ7SHWuc4VAibluyP9dwQUWVJxm5gdyhNMUy+MBg\r\ngX0XBHybDzvsojWsbdmMp/kUcqoUSOW0YLeDcib1r1Vtg+3zBddQPMhuukCl\r\nZ0Itp0rePzFcs/jSoeE5hnZjn461aWz3bJt72r8ORe6R77Co5E6uPlQC1oP0\r\nd8hkoQ8/H7+NAV2MR1uIIg9tp7scZj3LHGQ=\r\n=2Vu0\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"4b7a688d787bd30e60c77ee401af83208f65969d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.14_1648671225276_0.7810840809036204","host":"s3://npm-registry-packages"}},"2.46.15":{"name":"@apollosproject/ui-onboarding","version":"2.46.15","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.15","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"16eb3f8aa36365bf06b7b8bc88141615b0b8d547","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.15.tgz","fileCount":87,"integrity":"sha512-zFzG2UPTv1bD4w6Kut7ls/PA2KJ3x5IcpZVLg9YYaqhktw5Nmi67VYka9ljSmRwz7yRi1aFYBjUz6VPC8VbrUQ==","signatures":[{"sig":"MEUCIQDIyog4Ee8Qqdtnn6Lo1VKNqBRKyQE4CTE07eJVvtnIqgIgQtJ0mLhzle8aU/cM103I0RsUs/ptwBzpxXtD4dNlJLs=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":929953,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLquACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrpIQ/9EdgEYkXF8RKlw+ZusgIYKLDhGGerXGk9Y2RpdMyOi59g1AAI\r\nfgaV+GbWbR2oHWkn/QnyjsDXi7/4R32HEonD8tdtoOAb0kZEl89Nlq5IZhfz\r\n0LEBsCJ765U+6fF4kg2xvGIp1QZVbZ5AKKtbkLNmR4xPEN6RrEJZgzX13Kcn\r\nnr5Bw7itKVjh+i08nk/zHIfwBhsgOPrST5NqO7nkok1ClIMg3SPGIwXr0BWo\r\napl9O74BZlGDKt2Vd5lXAPI9GPYEr5FtJlK3pRG+zD+geCxXT8kp9I+GjLND\r\n7cO3QpoiYVdfUfmpDF+HVNxMBHLK5ZjoUJgBLo9r6vj/u9xB7ajB/CH7YU8d\r\nNKBwi5gJVDApI/HyPqC9NJUXvM4Drz1pJbavFEopXuv8r76+dIF/9TMkhw2R\r\nGvhffIq07rVjf0G98kxx/dKQrNNAhakF//p5Lpx30QItyPzCRDZQUpWgv37q\r\nW2gqywMTV/ZhL1BlvX6HuDKrL1r7KcFO5BtcC9Bzo1k8hr64eqTNOKw1kl0C\r\nUdT8TM7l4xM6qhmr4vz3ZFGwDg+bturwVD/KUQXdvv7elmxIjYw5aQKBYUVk\r\nMuPZZyMEacDpi1pM++am9Jzsm5H/RWSaKbZbjJ36yvfH5vkdQwmnK0dH0C/6\r\n9CzkiekeSO7OC+a2h+5oTPPwc78zWT0XIPs=\r\n=yFeE\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"81e8ccd71efbac06ffad1ff05cc658e54d3c0a52","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.15_1648671405905_0.5043627088814064","host":"s3://npm-registry-packages"}},"2.46.16":{"name":"@apollosproject/ui-onboarding","version":"2.46.16","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.16","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b27c28466f7601ce36b2832d73af13466cca1192","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.16.tgz","fileCount":87,"integrity":"sha512-70VRIdNVYYOz/cazrn6DH8cFS/mVHJgNcHN4knV2oGiaYUCeMc2yuzS6YYwtbTwf+qdHKH5h2Ew+a2oMCBGJBQ==","signatures":[{"sig":"MEUCIQCGtNYWi4xpL3i2vIUCXqN+9WOTM7dG2OaymuTtuoX2SQIgQKonQWxLWzhtMGEQD+6yClKEr4/+dKqjE/mu8lodZKI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":930132,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLtaACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqH5A//TX2lUzBMaXyb7MBpT6nwAuveaGTuGpe12gZa1W+oSPOXy0K+\r\nIOdEigBO1Ppq5ivVgkIIwSJ3gX58/0uSSv4TFPoWMsAIB/Lh/3EJkl5Zn6G9\r\n1AtBxJzhBWmzESGF65ZJE87bT+fk/VpY4bMzcWDvV8RHgpZ/GmBvBdpXnopU\r\nkwATHHLoxRZkGvJRFU7Cy5DWCV2CrzMKeVkEU6q3QYjypge0voLPENFZMPpA\r\ndC/gsclea5GhaO8g/zrx5Nsf1Fxt0i/1YhcuiZUX+0LfP69/iRXWu9/aGi23\r\nqSHTqqqQU4H5j3KH42KlIORb1UrrHu8CFLIo3FsnmsWQlxNc067uWh3mAyGy\r\nhBgggBGIiLuBKLPLRh5VdH9cYXq5GaZktIYhgAoPP/Qqz2wxv2LdwOIGEipC\r\n0NisKYywIfggiALepG3ffVeld0FlYxybn2mefyFcdB6CR1VVDKcUDktvP/w0\r\nq5aRnIFqoPU5cQV9DROSIM6aS8czgggcpyxGGKzqwWXop6bkfGMtjzYc/XQJ\r\n0Q1y2dV03+xxKHZojNlfTO1c/ijV2W/H0UC/weQa3ePV8WYxWrURjgsbfcFm\r\nU0MH9XjgnIDVW++2ZFwYKNJ2Zff/G95coXjbrwtnvhHUdn05KzHhatuxWIdp\r\nK0Nd2kfJPRniYZHZ6EKYPEvVvgAP9WMrPGM=\r\n=vhIA\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"01ba076f1a3a4dbd8f845da31249ca0a11b6dd7d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.16_1648671578600_0.3214345909282663","host":"s3://npm-registry-packages"}},"2.46.17":{"name":"@apollosproject/ui-onboarding","version":"2.46.17","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.17","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"05be36a12f4e50bdf0d73561d7342cc533cdf31c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.17.tgz","fileCount":87,"integrity":"sha512-3/WYlemlLlQQUib5KMjKrxSB3M+Ur8iK6sBiQ4hDWVYzJT9SGKye49NCHmMxaSTbtNBhfKjdqGuITCUkBDh9yA==","signatures":[{"sig":"MEUCIQDqQNNMeJdKQ/MlxnTyNt0YV417pd1YiLFkfZBpxnWGmQIgCb0COs0NhlhdJKrBPFzWW7sQfmdXMY+0xHVm7jKHjhU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":930311,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLxFACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp48BAAm4fk370cwTJn3uFueJKbt2dmM2TeV6RzTUfCo53YXbK4x/ws\r\nhA8wqBEMIgk9bwdHCcWTtxPj9vVUSHNbWFYW0JBZQR7AC69lRaUzcL5K6Mup\r\nMuklg7DfrmERGnPTd+hIO1fDM/rOQbFhIIpmnjo7XCHom9+TP4J0+uwBJfdx\r\n/wXIlte7yyjh4k/Wc0wP1d6C0v7rbhaTwZAtJOUZcPDP33UtKxx2FR8CopJ/\r\nPzPWQXPBPsI0Pda9d+3uG/Yesf7nvdCl6VSL+SUrD6RrXW+dPkJ5H+qumWS8\r\n42kSR3i9k444iXvyNjAbt/YFtjwwF42iJ8GPHU7so5KYbJK9byw+u5EOOP2f\r\nBKXMhOiN2PUHiQ0t8iygditU9+HbgY4lmfJUQBXxkGiwP39FUYZ58hlP7Hr1\r\nM+xdcD6wTcDz2Lbpg7QhyPqSDMeobhQHLa29wTtYUPMseh3Lmll5Z2DFIaQc\r\naku4mN8bpu+B/9IOsJ1HXoiSqnsKBD2gTywsSRxFnWEOH7gzHZx8DVGDvIXM\r\nAEqiZBGIqFtzRadJkRHc51JtLwufnZTQJM0zC1m5g8iVh7H366jc0ingL5fn\r\n6z7WxrODm7PcK4m1ttKMFG23uOHqoGMhSlTjIu7UpAZG1tqT6sP3EzOWzaKO\r\nE5d24MDyS+Kdcuqn7N0WqzOZyBCDKkN+J2I=\r\n=qs7t\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"e1b5312728d9219120fc8db06184cd3c94b338dc","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.17_1648671813229_0.9114956537516641","host":"s3://npm-registry-packages"}},"2.46.18":{"name":"@apollosproject/ui-onboarding","version":"2.46.18","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.18","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6ed9d4b072efc4be2f630fb5eaa20d9cca55126a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.18.tgz","fileCount":87,"integrity":"sha512-WTLaaL6YkWCHl0EdGpzaumeY16R9YhFqkFklBjt7gMnHI0ml+RuSreaIfLIYmpL4WSrMUfCeiNgwvX/+pnvwUg==","signatures":[{"sig":"MEUCIQDH+eKBzY/HPK/djzzMY6GbQo/COQ6o4h090FfsBtQcRQIge9bAoUkohgZ2JvwMqZ813g1Imp5JPnPWOolLeCJK2z4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":930490,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRLz3ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrYpBAAjpCL2sSIB9ghyxB/RVESCv9XrWtnXzT/03/qVp9j12U2D1qr\r\nzPFwiij9Ip2Wiaprc+dLKDCnC6m6u0yuANi7Qbu/GE7QJ/QqhHlpVG8RaidP\r\n+rhawYgsexTQoCAIeIF7TGkuyKR74lIoU9308DfpXranAfV5SqPjZCGHD7qd\r\nByeBfxAzqdmGfJOKtrJQskUKkHysuA1dpavR+/XTUaGM7jY1wgrrHkVNtyJ2\r\nVdWbl+qiZ7toxdXojPmsdM9wy0xd05ObsSobhSTPBdm1MB64Zn+P/fq6alTb\r\nTo2RzXRLYwb0WsYQ4RFUIE5x5YRKse2QftyjfLUv+uSbVYDt4FMbssvHOIjA\r\nYjr1vJ3IhhDVY1Emklgoe2PAcZUMA5stHE5+d+XNmwWRYO+Hhks99J2UCz84\r\n3ogLdZiPhpXOzzkOcmmJpR/RGWDqwfZNgyMS2XwFaBuRgZN3nLraBUv9jxrV\r\nn60kwDdW/+HBMHbV5nCdupvaH+2eus+oc2wroXXvNG7hUnlybvkI1RGD0fV3\r\nD5dzoStBVLpvciAZDoVFtlFkI70gkwLFUzZInMTrsbYuL/8EecYo0cEujuVJ\r\nh596L//TeZjRsdDPXLkay+sK/3oYCylFSJIsxtB5kLeoLIFJmTZ11suyVZy8\r\n4xzgzdFA+q9JYhwAbgFJkknl2UmitUdQaYM=\r\n=MbXx\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"33d4839ca5f9b235c3ed7a62a4b0d4705fedf82d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.18_1648671991101_0.5627751597845438","host":"s3://npm-registry-packages"}},"2.46.19":{"name":"@apollosproject/ui-onboarding","version":"2.46.19","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.19","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"adcc76f2249d5c6a1c7954cdfd969ad8748f17b3","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.19.tgz","fileCount":87,"integrity":"sha512-IxTEDuavD9KEyB+JxtdmXhDPERFoBwAuxcm2RnimP/RbQLFHTePnWepUVREhQWH+CqF+eAzvwpiTJuRo+Lk8DQ==","signatures":[{"sig":"MEUCIQDGen404SNaTlqhdMUvUEAWHzndZA+VQt5Rar15WOcwKwIgcVABlW55rDQ2rCbrfemexA5dHxUeufPfVs5wFMhrMCc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":930669,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRL2UACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp1Hg//TNj+b1F7OpWTQANE3pO08R5AIOn8ZXsy2Y6NDJeCw9TAGmDW\r\nKPF2h8IGr/A86g0SaWUhfvNPJKzsDjxZk9GS74jY0eqheAHwjlgB8/Yf3FQz\r\nq4Kigma/juEEru3PP8AtdsS7WLlmjUh1zivLXmHkQX5do7t1N07Ved4tnt6k\r\nlXiQ+bzY3oaz2ZPHbpsmh43Uka2pby0JzsxYArBtsQm5K24n7W3NpPx33bQv\r\nTvfyVyNdxXMe1UC2O/+cWjofiOvpH9Xn8bClDUxn2Na0yTzCy4flW8IEzViK\r\n5CuRMDtE+x3okVLoF9rhmKVH4UTdDNmC6RI6GMm0dXq6NBqjYQHCay8T2psw\r\nxEYT4uspXF3wMz1d9BNyz3gjQzSOfvxiWhTz+kfTWm7HG1+JFxDHtnE3u1Ek\r\nl3tm9UI1j5Z0MohjfeGxkM/DFkqe6ATF9qaf6PvMgWsE/DrauZw3M0trEvFZ\r\nwi0/z70qxXOjro66UwvHKfys07qmIJNuDbQmFHXpYCsyLns4EjD2SH006qRo\r\nuSfINqhYzZLS0WDbkpi8nqsRi9kmgFo905CLD+22QBUVKXC4xP/OH1raTLqt\r\nLztxT+GAx8rFtyp/cxygMu3Qm/F+3zHXeNQlWw1fmk1GNgewS3+8E9bWeaqY\r\nzV7aYsYrhHUsqJhKEss3ADcHIFsRjtGMq78=\r\n=XVM4\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"6099a0d7109442204c22fb6c21ce58a34107e223","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.19_1648672148012_0.32801329727909745","host":"s3://npm-registry-packages"}},"2.46.20":{"name":"@apollosproject/ui-onboarding","version":"2.46.20","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.20","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"30f084c95cd054414f94ac67a9a75a4a13fec1bb","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.20.tgz","fileCount":87,"integrity":"sha512-xF4jUiwADMr96PmdBw/Mu5AAnU/WD/6iJ0OzSyqyk1whQIK06TK2Exe+W9TBXH6d6CExgQbqDyKwJM38ew7thQ==","signatures":[{"sig":"MEQCICp7o/tWDg5piohvxGz1J63byfkrfnuTVUhVMRSz0UstAiBOlu0Bbq8Dnk6TuK2vLjjRnFrhuFP3s4LXo4snnSFllg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":930848,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRL5oACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp+aA//U+RuvjyuaG978YNNAIgagQuADWaahNO13YfCIHgEktbO5eTX\r\nOO2Pzf+nvpco3MEuH+CG6IWWhRjB3vJkOnqJFMDrxuguqWE+4LkU+86xCKd/\r\n5Zq4dq23B+/swbHZkdfTdb6ldtZ8WyUMpSuGCqD4WtnyDLurLHBvlxB+Ji1B\r\n3TjbSE5b+KYp1Hrf3KX6ZrxdPRmBdzuPfZvH0XgiD2/ncTYJnJwpe78N6Z2T\r\n4pmVhsAo8SCPhumwefgKKsl0kYVZtBeubNihu96/AdVHwjvSekHS9zPQiHOn\r\ngZOYKv5/gMV7e9PqRQsOckYtOZidx/lMD32uus1B4Q3FqmWlXfRhBjwbtoQx\r\np8LZANxjfsgyJzpFIXa73QwErMpSFKHCfJIQOkmTmJBR49Wr4wn/9d+Jf6Dp\r\nzLqUbm5HslK9wG89EEWYeu1zld+H5p707Gd6Htj1Y3BXpb4LLmgYni7/idDz\r\ndZyIffvvOk/3RgxhQKR39jSyV4VeDXPvEcMtpzfy0w9FGAQZ0Clf33/avbI9\r\npwEHiPDD9h4iQeJYOaOSFWfDYEEBG+XqFiuKjEw6dj2rJlYAKQVYZBOhIyNU\r\nC62qg3CKQ5rETLSXEW5BbSZUDx3Z+PxUhT+7wX7EUekCN0Xg+FJ7x31yMJhf\r\nZg+eA0R+BRcZhReXjuEui4gHBEz3fPP5/Dw=\r\n=Uudu\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"1b3801532001d82f81bcd9284f3bd45883a2c0ad","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.20_1648672360492_0.44244257571116097","host":"s3://npm-registry-packages"}},"2.46.21":{"name":"@apollosproject/ui-onboarding","version":"2.46.21","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.21","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"43d54695c5328fc9edb2348eb093e4f11303d5a2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.21.tgz","fileCount":87,"integrity":"sha512-qywFiJZV2j6xE6wt1CTRdWZ2IY1I8iAWq4lBAcD+RXazgtYlMr9xzcpCzI7Kc3GeRYAdT+vbmQBHGLNIPL+vfA==","signatures":[{"sig":"MEUCIGhlS6iGDVI1SW9SVSd4J3b8mVYhRumZhpfKxwqTwZQGAiEAifbJaNLzFGhUY+5UR9znpElE7upmeVhjSPbvtfuzBcw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":931027,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRL9kACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmorbw//cRUIjcFOMTUhAkN0m+Piewzhnfl5u5mR/Tj/pj3OYeF7FUpt\r\nhqX0TVqHLSS4loI7UfreblhY0SWHC3BbU9On7ZVvSZRyoYHHozqOxRQntwas\r\nDth765g1XGK14sOvjy1i37lROcgvM6KX5AZ3Hdx+a/JDF9GCfeur2+QxO7gR\r\n3eXn7YURHoVLO9nZyB/K2hG6aHwnYPRmzN2RW4pipmMnxSKfnT+ucCvAaA1B\r\nsVH3qT1tbGcI10xxhYUsnDZKeIYtf2VMmYYgtssH478UvY4eFdZ7cr7BamyD\r\nQrEB6GTcz0uMkfLYhkMpG++IZURN+HafzJcm2l+bMkAo6ZTDgRHE9UZLqkWE\r\nhL+6No/RLc3y3FgeHgVMYeuTWpTsOYTRSORLEBfvI/4LsnaLMe7bNkm81ySi\r\nnk17ugUTaAIU4/QAgO7wSgA4OYn4qfgxTNU0jTpb64MUy7qDN57hJgf2Uol4\r\n1bwqZz7R79ERqh0CtkDrMVQIp3/L/tqkOpAz+lepR9pri5W6ADs6qUWHZ184\r\nfHKAFX2Hxvx1OUiU+NgdM43q9olvyyk2ZLVua7ykp2r8Mn/wtXgZ6idDZNPo\r\nKLHQeg7ghZQY4o6l5xmKIJoUW9xVGi6juPQ5YPrJVfsae6eYynubNG6egjYd\r\nt+gOqSRNMx8B7TAMCEux1TEqCYKl7M6Hzwo=\r\n=1zm0\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ef31e18fd365cd07afca135b79aa2d2d7c36910b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.21_1648672612065_0.38126318975551476","host":"s3://npm-registry-packages"}},"2.46.22":{"name":"@apollosproject/ui-onboarding","version":"2.46.22","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.22","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"499ffba516687b5db9b893bc76530060c5f99681","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.22.tgz","fileCount":87,"integrity":"sha512-/mebahIpcLaDKhuoosaXm3irCQFxRiOqeiz3ZdxPOJV0Q1FLhvRJe9j8DejVT3dVPyoDOj5tOsSpnYuMF+4yjg==","signatures":[{"sig":"MEYCIQDyhc3RJ13yyBwHq7iVq9navdgsm6YIwQybGN8/8udu5wIhAIjW6XffqOdwNmTsnFdMSe1sTfRCn3QJGIWuAgQqc9Pl","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":931206,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMALACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrrdRAAimcUs7fHA+hmhFm3bj9ysS4HzHvhxYAXz5eBbaQSZ/P9SkzI\r\nCUEDqbMglpp8jVmg1427LObKWqsA8hlniEFGXBmFtM9OjULCcax524gS2AIu\r\n3u+jl6dkdGCPVHFButDerH5G/pOW1RVMNO93K+jHLHjZCDi8TwS3vPkPYnpi\r\nf6ggQlXvTRfWQiEu7VaZ4q3jtbeIpq/O7nzPY8nRsgb+GkEaXH7HSlenObm1\r\neBFZ3JdZZoo4btj4FucruX2GRL+mM3ttjf/k55GtDilYtKOIhNGDctRSOq7E\r\n7DlJUWun15wivBw4uIPGPllwC1Vef8loXuELhGuhp5T+gt5HT3FPH4sFoOlm\r\nT557b9l8pPSpk2tFjcfnFDyHZd42yOAOuYCIzrFUD9eePtiorIHceA80fnzS\r\nzoyFeUTLwBR1+a2UITrKAmFXEKPvo+DQzNWsPSTbmMZJHFGNNt1PjnAl1poA\r\nA46ECjhDyAw8etYLiW9Z51pFApSg3lew+hSVhFgq76VFHP/BLgd8F/sxJqgY\r\nBqnH8xYuJJlF7f0wFWAVEw/atK8twlX3fcw3yUAuy89gjOkx1FheewtlnWVY\r\n+j88di2sq9xe5VPRD0xXjKPkN9uFo5NuQrIfKSGVSBWXOOcGaPW2XrLHqxF5\r\nlJobWGjLVleDt2UUSv0rQzdxvIYqd4rNu5Y=\r\n=cjno\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"28f340d4aece9e5c5d1931c477248fe9b4989c68","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.22_1648672779382_0.12547878442809823","host":"s3://npm-registry-packages"}},"2.46.23":{"name":"@apollosproject/ui-onboarding","version":"2.46.23","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.23","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6226997fa4d3e6cd28b207bbee77dd4c42ad6e09","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.23.tgz","fileCount":87,"integrity":"sha512-u2XnxnbGAUiHMjPf47Ut4CJuxi2z2wEUgwm3/RrUtRMXZcOyrxlDROD1JGp072C2JEJZGPVcnCmPSckyO4Hxpg==","signatures":[{"sig":"MEQCIDRrQ1IzQjgC0EBGNyMY4EBZtnJTNlGGqwF9ZtyXgiREAiAxbB0oFY7psX/r3Co7rqedCmHAcXWLvna4f0O1wukOSw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":931385,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMDhACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqibQ//W0I4iFuJE8GecvsrUDGDvpaNJ7uW0fNnGASLbD0Wpa9Vq9Hv\r\nYe9pjmGnb+TD9o/gNs0+sdDOCd/IVhgQqEVAxvCBYj1hpbx3Z1/DKuw0XIjH\r\n2449hsLIzKfMcY/rcLDvFhxrKBxKEYwyfvzwrzE95teI6uk3mf1zLQX4LSUr\r\nwqs1GuOuBGJk4bY9S9/Tr2gN395/ry0OdmtNcLuAI9bmDzNWPfoS1/l79Gd8\r\n5Ae3yrBWAjfI9DAPovjX/QyAE8JwqwC+hxTGD9uIBmD/002Rkr+/rQHPWHVm\r\n6yG/5wKS8uhlgLhp8FlIWnOEAj3rGVNk2kMV7KIMSKQCLGXRt+qnq06VGYgs\r\nDiiD6N0KBnwuCaQYgxDvaqxEHvIEmzpKe0uqEFOrimf7VOP2UcRbzzQpAdNS\r\nWMN3d3ziFacryCt23K6ZjtYBmzmEjMyH/fGjHnzRPV4N3QYrSz3L0mc1k0i7\r\n54sjg4cj81qAF+rMMktu9WPN2NRDDrq1idYEPf6JvpNSjQ3zWXIo9wpBbaqZ\r\no4bE3Ul8BeQITS0o8sbvAYWnnUlWLHYTBcGGgZQ6yQLfDQcwM5hf4Ya3WEPC\r\n4eR+T7WjDiycKxSDlqDc10pUyaQrZhUZdk5FA1i2a5H176HJCQJDmmCGbBSW\r\npvM6WKQwCLzOuuBwprkRR44+6Bnrow+2MM0=\r\n=oiu/\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"815df524cba010a1b45917d1cdf98793361267aa","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.23_1648672993601_0.6564679792279873","host":"s3://npm-registry-packages"}},"2.46.24":{"name":"@apollosproject/ui-onboarding","version":"2.46.24","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.24","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"05fe2641f0a325acdb506c140083d878ee32b117","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.24.tgz","fileCount":87,"integrity":"sha512-iShu3v4OGPgxR1u7PNTVQlJKeTLQ7AqG3JZm+8gSCbCb9nNuAOfbBOA2qH8Zo8yUtX55KPL5j5pCcFlAnQrE7A==","signatures":[{"sig":"MEYCIQDBFdXbY5kJFYMzs3R99NPHF99GNq5K0YX8TrUawCftYgIhAI5LCM7qVnhuG4AoM6Lzg/JoxnuY4Eafai/tfhqATQrs","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":931564,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMGEACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmokoRAAoVOeIGGNaiUnMuoUOqi1OQ5Fv8Kgt+8uednTqh0tLHFol3Ui\r\n8yMuvQxsqNuiCHKo9u973hPyTEGy/unoBei9LbD6xPo0aIGHXspHKQ6jzkuw\r\nzFt7X8qKo6mfJZkOGaMJp+C4wZ1XUNUIFNyha6XagN+mFma7uFSqIkHVPKSF\r\n6Z9pbPv+FmDM57LcanqxJi/8lEnoAqq6vY91c+wlC9HyM18bUJtqsedYWWZ2\r\nZUxVUwikYU18/4u2UwD+G4CrWjjq6Mp812G+tcjwgiB1tcKxQxtZ8wr1K1+O\r\n/sitj2r8j6efdUCvYtqtUrBscyYeCeNgokmSEFi+qdlk4Ah2oH4tP566X7+S\r\nTMcJwv72NlseHUcdMO4+IHy6MwAdr0dFSRp+V8CSvHgL79i21VlpOTQFkoY0\r\nPQb6AMPF578LJkq37MzYPLmRUmbJjmxfNrlBalPlDMYyd+1vKmSLVbGZCQD+\r\n3jztSOatjhKRluDHzm3t9ugn+4SVx+nB52O4UgvR/+jD9oqZ6JFlIVgE7JG1\r\nPKe4cyU0KclFFxHJObs2JC9gtG1uE4oVnMlkXCrCz/3nYad8igRRKXD5cvQQ\r\nUtqC4FvkazEhLZEKoLxSpbqlffkB+HrF4ulW1G1gXB3LzUs/tzmnnjIKXakK\r\n96CPidqa/R7kTS7jtVNMVQXx1UVFZGXMfxQ=\r\n=tuBg\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"18407b6418215d2cd9ee12a2101a58aacdf441cb","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.24_1648673156195_0.39750891148311296","host":"s3://npm-registry-packages"}},"2.46.25":{"name":"@apollosproject/ui-onboarding","version":"2.46.25","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.25","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"dee1c6e7b40c3d8a788f996ad84ea29c46828207","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.25.tgz","fileCount":87,"integrity":"sha512-rYR7BzuBL0o/7waPfYLQ/dXMHjtTERY7TaFQP7ZXT5QBX0k8pEbBABFRAQ28GfVWhrO4r1Kmb5dV7D0kmLdFNw==","signatures":[{"sig":"MEUCIHOMCG8BRpmJ2hQ7I6WafkPnF3QWtrViO/4wGe19oR6sAiEA9OoohPcc2+lQlHAw2AvCl1iJdtHAifK3nY/nr1WP4Ig=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":931743,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMI/ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqRrBAAjjMzTYr4MG4ukBIENAu73ssPpvy7d6tIAZGRAvir3jnot84H\r\nPA9ngGNYneDcQDCRUbMV8sVzO66GfCDRfCGXOMbOmVJHEj+351qN7LADVnpZ\r\nU4JkxYk/I1WDMquapuuMw5THHUVDMTCB6aTih3KKZJz0SOlyyfp2fiYk0DAX\r\nMN083LXZoaxXb7uyte089S/Aq+A161m6ncPoIfPM+b44Snm/3PXNDUQtngHw\r\nWTCme+1t7RMhOy4mvHIxlJEPhsorOIET2cp694DjFbNSfgUW1AtEVXiuc8bo\r\n3XSficB1Or4y279u0YTY9+lCjpoojjTxRAuf/XqGBMdDIY5720iaE+m1rKT5\r\n8gVLjrAShU2QImjsq+yRg1jCHc4dPa+L8+rq74osHq0s+NeAXV0iToHvaS60\r\nDjq9zD7uydSeBdVSjr6bY1YQ+DB6haKbALM/lLsHOji4yCzOQhksKxhYp91o\r\nK7JQv9vyxYgB/f7jWs7gPVJBN/alTXhwofDCsoO5BeXbeMAY8nhHHvA2OuUk\r\n0FcjEFD/gmQc9JG8saNwMuASaC5pssWbZS3IN2NSvRy57EWB3O5N2WA/waxm\r\nVeu/8BNlU5SQGhGgeI7ttIZvcGNY8JmIqFBfaWI9n1t3SBhrD5eSB6xPuBYn\r\nyqB8uXjeulJtPMvu1MY3wE7nDcOasNr4M+U=\r\n=7nfP\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"a89fa6e3fd3ba4a959a33f8733d9cc917654dfe5","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.25_1648673342696_0.571021600430583","host":"s3://npm-registry-packages"}},"2.46.26":{"name":"@apollosproject/ui-onboarding","version":"2.46.26","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.26","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6ca9fcf769c8a04fad753b077284ee9e5a5d5170","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.26.tgz","fileCount":87,"integrity":"sha512-FyrqzQ8qFxHtQV439UsrTkrCdZlFpywwgx/RgxWqQAzQ9eUHkFzJh/11CiTTqUWPdrZAoAekZoe66zQy8zW1sQ==","signatures":[{"sig":"MEUCIQC1n4RQe3Sgd345ys3JnYOUfWyGSqFeyJcMlElMjYEN+gIgI9bhAIF5SS0z40TklEOkEo7yEV7UdikdkHKL+KFwJXA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":931922,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMMgACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqLmg/9HuJN/8fZE6flt1ITKWQ+sEXARXzAgAiSg59L+3DYf+ZEtEaa\r\nfmnuxMt2T+rpsEbb53Y8FWs+d8T5tFMhNo3+PjSHee4VWZX2RmpGNsaSsB5C\r\nTywp8bZHk96spPpn/eTOO/NMgy0TvZVz07EqFZoNfCBNwJnur4m2eB1aWmeK\r\n5mMHnOyXcGvkgaLOczs6f1xHXvOOIIiGOmnpO9PyMNtC708wcHkJbpeLH3z1\r\nnS9+DmieuiQAiiUzrUQeUPTghcv3wVUjZJ8U6fpwgP06NNZhWH5A23f2QgrE\r\npYCSv499oqz9lVgb2lwofdKLZKElqlNMRPAbbeb1fFNmEtqkiRBF5IKzpAix\r\nShh3kdKKt96d6q3z4T5Gcbatn0Cc0RdfySsJf0+aHfq90wOyqmtDSK23zmFC\r\nsLcuNXZvgZ2RwPBx919829hYXDk9SdLBBB9fDp9mcW+hOTefJZVgE4w/ImGo\r\ndb53HBB2H2e3ej4VgKkeZ+Porc3eOgWJMVNATfKBWXjH8wt013OyBycl90lm\r\nIbXl+lEMakQcIKb1ZiIJuuZYUgitk73u9FLSwAL7FyQFgcNKUFsuRO6QP2wW\r\nQSrBJDSBUjXbo5cWVpvMDWXtxYYl8mz51lZT9bS99BeUuPyAhnFPr10jI7BP\r\nAyJ2ribw43T8+1+oi9ZyUCvLhnlWJABFETQ=\r\n=2unI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"12bf685484c50d48f34459f103546693ffb0e727","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.26_1648673568276_0.5765594497867454","host":"s3://npm-registry-packages"}},"2.46.28":{"name":"@apollosproject/ui-onboarding","version":"2.46.28","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.28","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4f81362127bffe40aa5bdda408d863d158505d37","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.28.tgz","fileCount":87,"integrity":"sha512-5fSawlwiUuLWPEG8Oucey3bLub7NmF4Fo2XgpIlIVBzJgPnQye1aNc78LhB6gSFncjGakszTx5PkxyLYQNHDRQ==","signatures":[{"sig":"MEYCIQCHHTmZh7PB3Uez/pWn8HUR4B0C0GX4MaMeYNmv1+MUegIhAOrSiC1Abu3H06P4+wnZAk/jCJWH+TVM0Caw9RDplIm4","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":932280,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMSXACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqkLw/9HtJwPy73ZRPrGmvYTN9o3tU3+Tgrme66WGE6YFASuWurwWGA\r\n6OxaZ+IIN0shSCU+VFX5tIUtzznzDDP0sgY2cBxXcWczW+El8034ABADzg7V\r\n/E2WL7eq8JlGOzKc6deIjUx3mFdJYOL0voxyRIMYiF8xR7FGVjAc8XPWjl9W\r\nDYyCpitP1ZL1e0cVYKEq7ASUxVoXveoRy2DM+Ea6uOEmaWMnwucX9Dovs/sS\r\npKTIJ2mkM5UUWF8Jhp3ngd6+3NH65fM8bZ85/EKZPOrJ8aBatfu4QTttEYMp\r\nWnNpOUoowX9uKNYndAZ1HeEGZulgBroxOAsw5TGsd5pQwxZHJsb2GAxWXBR+\r\npNZhmibutpL6vOoFUlU4RMRCg9bpfiv0OF6Ji6SoKLZXF/T+Ug98cTpmL82H\r\nQrweCEA4CVB7YCCjDtZ2d31Vawhr2aiM4MxP+YsqNn8trVvvv/9xP/1CfqR0\r\nrIBMr/nym5aUqE7h8+x2L6E371YEMoDbjiYNALmo+Om/TZ35Lmpyls/KuGTF\r\nPXBIxMW5sdNSxF5VERfX3pvdsEzdXWQ47JvtLCkxOLfVUqeWXG2PjInpsJob\r\nJ84dQklU4vkKpLM4JpbI7GUYh3DhaFU280nznj2c8wzE17CIPB6u/1pLdPM1\r\n+MFb1g5d4Eurg2nFZx/MJM6S7TZsibF1ric=\r\n=uFXs\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"5498b1c65bf9e78b54c04faf326fd513a0071417","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.28_1648673943640_0.43498258890268016","host":"s3://npm-registry-packages"}},"2.46.29":{"name":"@apollosproject/ui-onboarding","version":"2.46.29","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.29","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b9853857ba55a2bd1c2f75263dae7fcb3c36ad66","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.29.tgz","fileCount":87,"integrity":"sha512-wFsLBpW0JPhRdlAkpvFJxrm1tOd47QcwtnUIp1x2AEMlvK22BgmqJKAif7lkVjkOTTyGiNDgbZGqyZeQU2lteA==","signatures":[{"sig":"MEUCIC/5NnjpOCLqUTKfm7f6nYaTD6JOE2AZrJe6yGXxV4GQAiEA3lPDFvDkH0wVcAg4KF3JcAkkgdsWGHaoZB4EOUZH9ho=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":932459,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMU9ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqYrg/+OvSfid+8TFHt26eCf9I/gLlCHcKOU/IfaX4UAaOawmeU2Pdi\r\n/m1k5eWle92ydiAteT8oBb4LjjUHDLpucoQKrhAWZgXq+BAzaryz5SHmC4C8\r\naEidmEapU10JCX1mEPKMUvVYzfN3VSqeMboYEUSpdJflsYK9Tn5zLG6pIRyw\r\nqNxTa/i1AxTRZ+4V+ztgLEoEUNRjpdS1pGVRn60K88o95FUxH3Is5UBkJkPa\r\nSeo6dWEPMxG8IpiTTsF8t+iGfUYJdmb/hiPLYn4Pp4dAN/afVwOhpRwv3Frl\r\nB+zNydBzJPfxcGyp3pyCEePHjhiCc0hqEqE38jUmWSsBqXZUqypzvWQ9SOnd\r\n86/2ox5uimuE/q1ywG8TDHVwVOZxn3LWkTIfW3t6oEb2GlkgJG0chz/1IOJp\r\nOB/PVZfM6Y2gVYWY/LHD1s8dCvl3o7Ae7s+wMcaBG3yvKsWQZ/1FRPcUSN/T\r\niSHTgt0JF477C1WdWGfdfjgMpzajfyHjAd8NMZAxe9ZY9E6oLoLoLFrUlv8U\r\nqdaggkNA8Fvs/xh5G+8NgtBts3wcngwFOxy2HM/GO96ek/iwdGueIudOdWoe\r\nXj8xWIynNLm8cXv8QCiGUDorotSIAcyoxURpcJdCGOukNCFWB4GlcTeEyOQt\r\nawE4UnhtqGpEg7ooC6Eq7quzlpZ6olC1DEs=\r\n=aBv7\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"67f3603a7027e50135bdc89bde4336edfee7c487","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.29_1648674109505_0.7809375714393609","host":"s3://npm-registry-packages"}},"2.46.30":{"name":"@apollosproject/ui-onboarding","version":"2.46.30","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.30","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"02dbe885042fef50ba524b9f73263cbd672ba44b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.30.tgz","fileCount":87,"integrity":"sha512-+7ZC2iiLEwgvsBNCrZWTtHwBaKUfh0w/3ysBGksKYeXeJZraJRURwTk7DM60E3s1+ecoKBmGLC66t92FuzIwfw==","signatures":[{"sig":"MEYCIQD1xE5rVyJ29bbTIbayurrUYDOXf/Wem/Qxj4sQHGHW9QIhAMKpVY1ZrWLkc30BwZ6Jq6t75qz2l5U8TljX29353+vZ","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":932638,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMYIACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmrc5RAAgqGsUtGyuyT27IOvtHiMirRKEpr7tCmDJ93ccIux+f47m5cJ\r\n9HpzvqCCXgBCELZnI1QVQqNkVHEH9HAn/3Hb0Y8jNlQ8RKLlLpT3QkLTawOe\r\nIt9J6HRiZo8iFsO/78zc/EeWA70CvGDIQ885QZUgToxMIRc2TqMD6rDhiuW/\r\nUGrJ5JiXzL3V8gj483+ARRKBVcJII2I2LalgqnMUsKwmHgyePPQ3NcmmyNev\r\nBSIx30AZBKVtdnIHTU3TGWerUjTybsfiyZOudZHWyvZEvfsxIAaxm6xEaTbo\r\nUuMulI2XAj8b/IB4sZAsSaC8cIUoWejKmmkIa5020FaTSuSJEDXVedYiKIJ8\r\nkdKnsmSMTZ88+0F+sTBad1RqqwrYINeYHLc6xcjBVpxh74q1FB3poQ1Umd6R\r\nQjBJ8r482rSE392frsfprjLT83cjpkH9w16qQCmn1qFXoyR1A6cNadZo9zMm\r\nqhIpz7JjIWcPOfMM3KByhsihO/AEJTaS2a+SNmrqp0PCfqK8QMZxCB44LeB8\r\nSadWO014xOP6s2owJrsG92nlvaI2/vm01n3WtW2d550wGYJ7MF7cneBUieSa\r\noFB/WJUfd/Tw001lxT996z0kJPWy4MhDE2nEsMnkvIbjlt1Mbpmr0raVXb3W\r\nrc5EEMISMmTluVUVuRdVC0EiplziwivjX/M=\r\n=oL9c\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"76a416503a2a9e4d1be745c82a2c0c93cb6331a4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.30_1648674312441_0.6853361567994163","host":"s3://npm-registry-packages"}},"2.46.31":{"name":"@apollosproject/ui-onboarding","version":"2.46.31","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.31","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"617168eb9fafab12bd14b016b67cdccdd40820a0","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.31.tgz","fileCount":87,"integrity":"sha512-8/AmX+fWdeL1pj+9o3xPN6xt6JkhVVRNWQPBohZV3/pGIY6r35nf+3i8l44hE7BbrrA25l/5zwcSQs6HZbDOeQ==","signatures":[{"sig":"MEQCIFGWEdHbs9Nr28mdXjKcx8eoJN3RqbY8q+9rJJUQbN15AiAv7vtgoJ3jyyiQfehoXHdmgVqPpy2CwwTlNJfyLnRZAQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":932817,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMbRACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpi2w/+Mi4iFZXTQxvI0u0cXwDyMsgsFisa7b5jkrQ/FtRIV3ngc1sM\r\nbG6MenBF+7B5tblCdMN6qZlHEbTVZi8xQZKYqQssBMS7Uwe+LRm+cCZ1gW9T\r\nuc0bwzgDsHRhP+Mtl7rKdfEP+91fGLARNGGzwghgmsXlvLKPMfBbDVZU+98w\r\nnYLjnLjcoXI30vr6TToSE0R1jVQ9Uc6bnNjvozaoVW0aoNTK01gkNpvidCJ4\r\nknxTCi0+J7cA5iFb+d4Oj0X7coaxjqVyd0RBk4cPtc0kRD3SkQDYcLERRnAI\r\nWQM3FvpeDoILh48HC++FRUlr9bZMT5dWfpw0CuHxqeP7hr5bj83g3OVj1sOe\r\n48TKtGljSO0xvWmFfD2CmxmspMJ584xMaHsCmo8zbq9RMU9lJWnOnUjZfEd3\r\nVJKOGOuNTUk2rQSvjsRwQTccK18JglKBRvalh1l8Z4KP4s9/+D5DQGsPq7z5\r\ni+9UGm94NOkWa6TAJ24vei5C0RuJ6hAud6pLvalSZkLAKd6W6iKGZVhYb6ZJ\r\nqI0/Y6RxYhgY8GfQaz6WLkRgNJb+R0bVl0/rYxIqxlBVfJyLoxfD2lDxp8EV\r\ndK5sKiJJnInhZ5fB/CbMSMYFGcGopiZj8kj6ZAcNwYru5pN0DgC3Ju8WJbdS\r\nRDeUFPYiqnBf+AjSyIJ8VrUcT5SJsiUhtB0=\r\n=y8p4\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"2727038d90b0ccf5129ad2fa8d6b3cfaa57618c0","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.31_1648674512980_0.6645336391560668","host":"s3://npm-registry-packages"}},"2.46.32":{"name":"@apollosproject/ui-onboarding","version":"2.46.32","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.32","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5de28da028d4aad999a389c14c2888fd88c3d080","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.32.tgz","fileCount":87,"integrity":"sha512-Fmwj+wqjm3lojzz2kebVuBNknj74uuS6ilBYDLJYAbA2G2E5ZCPtWK64ZIZ2Dv2SNcrah5L6glwAYDeL8TQtrQ==","signatures":[{"sig":"MEUCIQCOLYeQpOg+oF+pu1+6QpeUcPtH8GYQJ5nuYIb4vbjqqAIgcsg0yOYYwMF5Zd/WOHeMpAtWjLFb3fOCP4Btg9phqHk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":932996,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMdsACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq3ZQ/8De/jZlkrToHghlvJyYrQ6+RuRofn1G3XfYX7mJ0eOT87jq6Q\r\nSE1awnJKBdERq8XGEy8NSGOdW5i5Ny9oynLOWsD1Fq1mLM7KKSyUhj372gTc\r\n4aB+3KYAfsC0M+LvD2qFI8dzv3SjrHrvsQ6YQfN4I/Ye5FwvB1f2St0DKcCq\r\nuiGpPox5PIsIpoDPhp5x6rMwyqpYJVHNVA753djj6mDs2nthIOUac2HxR+nD\r\ndWr1+irE1okgbgWCDYsJiQWcORTuF9TEr2FS8D4pqHOL68GTS6SuhxPqphYi\r\nxkHDBir59ZaCKUkbhQu/hlif4OXnwI/twJ7HOBhASZ8ndUus2W8WgosWo61A\r\nAxGYDJBmZRcTK4Lsn4qInL3ELPg4MRaf8y2K115KMeuMAqInJHhJ1v0mLheH\r\nviQXE3aeI0c4H5Yg97lRhYisLIKblvf68cjcQHNWjuu5fjDJ/J86cbko7SYF\r\nVATatGL0xVr3wLtdxYgNeXDOcrSlv63+eUgIi0Jj+hABpqg7cgAjDPc5gCpr\r\nHhqLWpjnXVelLRCu7lyOKUkqUCfmMEUPT8WGDmVuuHILWyxNSrQ589wUvJFa\r\nwKUveQI2JF5Sll7K/Ry5imgwNZGil0+7RMYzccDm9OUexzOQ74JRU7yUVz0w\r\ndU9IRfoOQSjrvpW0m19uIuCRS31pf7gj69Y=\r\n=hUGu\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"79c3310a8c864af0a4a6e6f313453cc3b46e2ad2","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.32_1648674668349_0.4571873095932464","host":"s3://npm-registry-packages"}},"2.46.33":{"name":"@apollosproject/ui-onboarding","version":"2.46.33","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.33","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"eb92d6428c1e56ee68ece0d219a848fded5f96f7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.33.tgz","fileCount":87,"integrity":"sha512-5Klq3/bCVYDzx8fzSr4lLlBLV411P8aI1azUp6diy7m3dXOuA6qhb+TI+hRbHZMlObWlC0Wq6gmcDcKaXXZoLA==","signatures":[{"sig":"MEQCIGTzTUZVrIRedatdSipxIH/FndAButuTY5WGiu5/yDmeAiAm28yIdqEbyamN1E36aW6KlCyk6s3bVnn48l4sTvK9eg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":933175,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMgoACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrOuw//YAfOOx71Ur3fGTEJUbpvkigALUFy/pw92PzVWZfKzMplz381\r\nB903Du5KPy9BDiuYMzBsDIkGloB/efQ3dQbQ2lOWkC4EY4WX3I+74IqKlujY\r\nNqq0YaocJ2XIFYtKlLk8SKxMn87nXrui8t6PRsT25B3YyMJIfTOlR9Hbb8ae\r\n5LluyZxMxDTWawzxqduu0Vg8FNw/U9wCIGX3tD0k98yqv/ksmkFnf++qDruB\r\n3ZVAPF7V1tOa8e50SHOJuT+538xgz0vH1iaQ58J5X11ppNVzHZmgPyJgjFnl\r\n30PYWpGPkouVWXvX3JvrAgyWIerrMBVGsZC/Qu6TNN3KtvRtwQfkmh5DX3ap\r\nwNibxBm6xDDetmoAD6seO8qJuwM2S45fIvhuv68XINYOb0Yw/N0WrXi8BW8D\r\nUl2g/PlffZ89ONEYkk/JwwYWeHpUeSx00Ib7+PJV0Biyu8OdiY3mQQm6KbDG\r\nmFnIf7OjrVf52UH6M6L8K1wjTb++rxKpt/W3CRKzUNseiNF3KHWJGm3cagbb\r\nBN7oQEvGqBoEdRrv/wLZ4DP368LCHRp1iquugLEWVbUqDquKerwAg+VIGSpy\r\nAlhfRfYpnGfHH11/MhLcVB4qkI27KXDDIeTjIPq9Q0MeM9NIDhPqt1Fht1Au\r\nNPHOC8bYwS1tdVbTI60CFsLJlbMtTm6/cNY=\r\n=XVLI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"08351d253896511ef1565ea112a90a58eea7b46f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.33_1648674856209_0.962352639909571","host":"s3://npm-registry-packages"}},"2.46.34":{"name":"@apollosproject/ui-onboarding","version":"2.46.34","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.34","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"63413b3c338bda5c47ec15e72b2956d43f5e9d1a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.34.tgz","fileCount":87,"integrity":"sha512-modUn7aOz0yEK1kJOWxPoGCqr2GSDj8pWt+fBm0Qvai9kObmUA6FxmYygbVbH2pFmfKXG+5l/GXjJIhqcE2+/w==","signatures":[{"sig":"MEQCICu3RMkVuqIBWNNLnxH00E2XCAadlrjvGGbkG+mqXz0/AiAxThGK9WZR54SR0hjkvtqLvBtkkGPMJxmHKc8ldNVhnw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":933354,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMkCACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp2iQ//dePFfDr7qqtFaulT0+36P1w5bln0jC2gcLVrLFuvb4ACkOOX\r\nSL9m7xOpdc5ejHD0byeheQ/EA2AN7Fk0AO0iXgS/VRfJyNo7/ouvxcwBMlCl\r\nQyZJKsbjL1geNd4V/ntK48n2tk7ol36ZYak3vjrEbtcqCv9x0V3gB3eIdzIK\r\nCtDn1cdJ52sgLSqD0wOHB5q2c8sVlrrtFh9OdC4ubcFhc5jUmIvfHmdyer7D\r\nilw/ksi2SX5UTS0/7/hlHly/7RU7r3LBq6q2vL8KsCd2ZkLALVG2ZtWF8fKY\r\n4AXDHtBab5wILr0hol0TxPNOLVHJ3kZaabQXZXYA1Wk84nxDtslfsC/hoKp0\r\npdqt75ruUSCOlaRH0YLdHyjreXVxhu1RGPLkjxZ6n375xPTdAyOXcXUpSBEy\r\na7kKGPOhQmcmBALM3Y4kcKLV4GEpKSNW1VK6hJtJGf0s4O/wHTGx3SjC6EC0\r\njjieXo0kHODjXb9+Vz5WIyuewY4Ofze3S/Vl+cRSHoldSJwDZTPOyjQe7CIu\r\nGDfbVxBDBYNIjm1PKkFFe/0m5qdwZJMhsI+YKN5zzT0hko4S9tvNC/hw7PoA\r\nnowWrPRip3+Cn3db1C/vDVL54iaqv90WSllUPuaiCFkR1V5VB+gd04ilCQuK\r\n5vpumlxfyE2NGrHbXRYE5XK8/GMRpJFLiX8=\r\n=qnlw\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"1009eea3b7cbeb492d8f4f336e55785e0562f151","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.34_1648675074716_0.995632451043243","host":"s3://npm-registry-packages"}},"2.46.35":{"name":"@apollosproject/ui-onboarding","version":"2.46.35","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.35","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1ed0c6278edcfe6278324b385a5af8f81eb5cb4c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.35.tgz","fileCount":87,"integrity":"sha512-uloGcrZkzoKf0bQOg6J+fr1439VS+OZzBjp86f5KYskOG7E/Y8GdSzkH5O7TWM5DS4uFLpha2ZzAcEHA5IzkNQ==","signatures":[{"sig":"MEYCIQD9l3lDTVhDt/t7itxKI8DAnfVQ3qPuuYTfUG38mshQCwIhALwaaGSnyBJYRdMdbOZfTU4e9pYw1RDv5jc0dBae+4It","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":933533,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMm9ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmodgA//dq61kqwAlO4SvqbpQRLy9eCXi7tNwO9eWh7U1FwjLR/bqvTP\r\nJDr11DvVFh39FRtbw6LDlmCcS0K4YyF99cxbwaMM3krpSn8mYwev8PQcEnHr\r\nhsgFoHo41tSdc9DzXE3WEOXIPxwAqpc9tUCEFUs3EbAe0wy7hWB3eTKfRe0+\r\nWZ+9Agd6fYuVM1mXSL/5S+yPpMjw10vy4c9UtDyUzdzk7SwhOZdjnupiHrJY\r\nGpAaT1rI3QJHnDM9zJHLofE0qJnfn/fV/Lelr1vyi4LkYaXvMGbbL5Utv3Kh\r\ngTPGo1Oye2PPw61MqwrsYZGvK2gEKoIVOostugMAbOvvwsmdkWPxK515iB6b\r\n3Sj/RjwB20ljWD7RsfK6NLFml4Re1gElRO/hff5jz677dswZq37ktlsWCYkb\r\noomUvz+PsXk4CnUusb66Cmfubb4nQ4gemZtM6hfFMmszfnnFibtmG8T8oyEp\r\nG0TmhbE+bziXeqz6S9cNynHRnchcbJi9c4eETK7gwkN5mI+FijxgBrDMAdst\r\n23JgIhrXQ7RtSBP/G/FlQCX3moAdTyeCoDxQbp4Bu6jLP95lCj5mQEiTYFBw\r\nLAmJsGDgAkKc74cGae3gtWnk/CLkNprsMIzDrFWL3CCetANBuclFNN4+FWbY\r\nrHbzMEvNw0lnRN4gTS08lSVuoJGLBBoZ16g=\r\n=ICLM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"63f36eb8e530bfb2090fcb2c2362c46a830f4273","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.35_1648675261492_0.638628752898879","host":"s3://npm-registry-packages"}},"2.46.36":{"name":"@apollosproject/ui-onboarding","version":"2.46.36","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.36","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"88c5246f3fe76005f1e3b1d58b7246ad8929a3eb","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.36.tgz","fileCount":87,"integrity":"sha512-if2T9va/92NJSo1+CwuiZ9s+jl0Dvw/SQLhExKGsP/vdzueVswBcoOEZaGz4z7ceHXGl9JzUK/BDyj9pVyluJw==","signatures":[{"sig":"MEUCIQDzQMBpFNwcjJgSgihyukAegNjV1KraZ1b9RbCs8LVBdAIgVN3iFVAM9OR7BRZg2JtHi6EbZme92VgFrIGEnEGqnu8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":933712,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMppACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoXJBAAkSDMfgaA3vEQJSGkC4gcKuzNzMhZ95A4Tmr4TvwNtQfOiP7t\r\n7Eno+5Wd3KF4iHVjMAwDeu+CERxICU3yDAFBPwkoxwCq1veVylwE5wmYPRb0\r\nKnGNFUOjO6sYoEYcv1nORcIoUbaz4Db2thiNXsQIUWfAnR82eqzv66bNqxw/\r\ncg24LLGbKpxPblVmIisiUHiZDyDt26WzhQQ4oTDevPKJAFv28h0tjUf5XyRi\r\nTWL4qi1l+/qTmE+G4fYfoWVJyX/ovdM0VnIbidOU8bfnaigAMxKaFb88nyG6\r\n65JHaQih0etAmaWGiy265cZ+GZm+vuJolZKA3dsA5+BLUQIn0YQ4DA/KsJN4\r\nZDYbAcl2Fhn9VVrVe6v4Fwo0GvO/lkFb5jW3lIuiziwy8NLUySNU2e9CRmde\r\nEkBQCml+g99m314jz7JzRemlLu9ETS929BEAInuYVPQdpwfrByCoiHimrDAA\r\nKk0M1VkFTWzw9AfRqiAv2m/H9MjPmf44O2Oq3whRsN0Cwy1ExMQePp1Vy8+Q\r\nkacIL4cwetAmkAiBig7hHVfqpFBq8OKcRFMDzXuyXuqAhPNb691+Se95C+7e\r\nIbioAGraA6NP0yEiYyGKhGy2ocdqDbeq87iOpTtBrUX1oeM5HCK5xznSXANl\r\nY0Lpowdqhbv1FLPrcGp8Har0DgibHTqDYJI=\r\n=FNKs\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"533dd57052edb17351d94e21d9be7b8dd3decaff","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.36_1648675433084_0.27146258273008783","host":"s3://npm-registry-packages"}},"2.46.37":{"name":"@apollosproject/ui-onboarding","version":"2.46.37","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.37","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b6ad471c628bdf5ba527ca98910adbbcd8f7ac19","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.37.tgz","fileCount":87,"integrity":"sha512-zNUdUFpn7F3O04mSBQmd6Lz7IqpNv7/i/W/KHiiXwx9ltr2ZTSSw1diu3rHxUWQKdw3py6xAx0jb+U8cqHKQpw==","signatures":[{"sig":"MEYCIQDRBjjp+g24nX/kYLoXJpkdMjqI+4nI+YRbfINKGFbp9QIhAPFG+zYWIfE321/plqfNT3hoW0U5YI+XSWj833n6UarE","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":933891,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMtKACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmolLQ/9FitNy4ulkuXUll2ixKMPymfeUBPN9PSt9RHPhb2cNfORl2wf\r\nFFxW6AJFfGevVHCypOKlyg4Kk7GIUm04Zwfa6Du8H02Wj8f5OIfPTY2Mcwtb\r\ngdm3qUXwGnh1/MEcCCayBoWSb3heHzYSAkT3ERRiEgl2Iw5nNubm30EpT/hF\r\nudKzVlFgsBdsq1pbgt7WsuSldTriPpBMtlWn2KP4lP/dbJWqeetiA/ZmJt4c\r\nemYbZRehnnJD5pg1zhQD6HzkS3sRmCh5vejBgwbTa3WzIu3B4SNbLaf5c7qW\r\nNnJkXz6uv/J/NAlyp9ww2Wlc3mytf22XSJjwy/MXnspu2hjyo9CBFEGH7O0s\r\n/Qaxv5bhCqBJLrE/wPOeySMwmOKFuhh1I2rHxohhOV9WF58MAiMO1u9+W2Dm\r\nbFLyXCrx9GWDy1w4zTp4Hy4W7SOeKXiJyetmwtrrw9G6YmpJwgpPPf86eN1h\r\nF+lXeQFj9GQyIR8G3zho9CRvgKrhggMzU09/9EkPNzIoYzT1pspa0+WRJlEu\r\nRtYHgmTgeuQCv+UDJMbYHPQMYmkwacvuUw4t88AmTn+AtYBa+Vifh0gAXnTk\r\nIIVnPS37MQLGInqeoX5jmoas1U00G/P2Wnxu0FD2aOiMbajc1d5wg+ALdyrq\r\n/5jEfm+kwtvd1OqnDV6pEoC5cFAZTvbmobo=\r\n=aThS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"a95a5c7b8aba07d54c7f20238c294fa33aaa35b9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.37_1648675658073_0.2284869272855956","host":"s3://npm-registry-packages"}},"2.46.38":{"name":"@apollosproject/ui-onboarding","version":"2.46.38","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.38","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"14644ddd0c1378aed0eddc77ea467e8fb452daa9","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.38.tgz","fileCount":87,"integrity":"sha512-FIqJ7biKFdmyJ07N+dVOLWMJrjeJ0ywCNkrfzQwJDVgXgYocXWYT1JJiXzs68O1u/L8zfqMWd7ogHDhZZjtJ8w==","signatures":[{"sig":"MEUCIQC4+YzXAxV4ymVh0SBVOyZZVz/G01poNTuum2JAAnzuVwIgRPPaU4fgoDlb71k6kTh4DZUb6JbrSEUYMv6wyv1sst4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":934070,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMvmACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpy+g//d4EvZSHt3Go2z31RmQFEcoA1+O8GV1lI5aS+f59IFL1EZ0Is\r\nqYf9hcUJbH8ilL2hZrdEsklpRf4AbwzmK4o/LHqYfrNF6Bd0F3ln709/5wqr\r\nRb15bCVCl0kjM9GMA7o77ncTwwPBRdw9hxemoL/ZGuuLftUls3Lsk5SqP3NB\r\njRfUdz1g4X/TILDqFXlxBkxwzOHUZ9PaycgFcKp3KBCaaX5PcuOXh7P7ZDTh\r\n2t3u+YRVv+MYwUe6klMiRS9ojd1YK/hW4sIVfJ73Urr9PERHTdvPSzQA2Xhd\r\nO0df1/TI7d7dMyO2Iux87n0+6qyZlLpG2mpkHxQ2DS1tOfL+/YOaqyKFqVq1\r\n56hMwszOe4MJCFgWJMpA2wqj/AMymYc2P2JN7MPG55RKrZTNMk2t4IPqDNEk\r\nQMWhJZoV1U4B1A4rCX9vq4mNc7MnCG89rGx1qaQC7K6qghiAoAH4euLHR01U\r\nLOh36D7+kgiKQ04tmHxZotKd5hhN1HJ1CzUP9V/imGOeQHrkr/o4xVorvL/a\r\naYbTo88wK6IgJTu6uSSdisFtfnXxg6uZK9/M7dfhthMyU5ur5NZIcwPPE/Rh\r\nvnTjQdAtV8yoeBHLpxx/qfL5WkrprgJmaDrDy1nOPyHC24kOd5GtaHYfLSTG\r\n4KtOfbevUsNxS40q0OgeuHv0Q/PoSZgIHPI=\r\n=6Dpc\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"2fb42a6898cba3470c2be091fc479487afa0855d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.38_1648675814342_0.22381300717158137","host":"s3://npm-registry-packages"}},"2.46.39":{"name":"@apollosproject/ui-onboarding","version":"2.46.39","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.39","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"84ce5ec42d43eb7282b4e42052c844c6599f9ec6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.39.tgz","fileCount":87,"integrity":"sha512-O0SRM9LwLEtwHFOuCZB5srLbeOLnvHxFIPH/p/AEI7h2y/OGw/s77ydV6RI51MLYzK+9SKHZyhw6Ce33CtTdzA==","signatures":[{"sig":"MEQCIGANA2a37cENYls6RmZx/LgM/2qBo/+JcXwg0FrvuiFjAiBzxJF53HEydrSfd4lyfk20y+shr9nUP6RWwfjxA6W89g==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":934249,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRMzWACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrMuA/9GRhZ3GRirGPaedbtrlqzsLRRHFUBRJ61EotsP/EAsqaRSC6K\r\npqKPMe6zq5CuY4Tu0j1tfV++kPfK/KZNnHfXJAQ9PP5hqWWxeoK2xcALvhYz\r\n6od3Jd6/wBk21EODc65C613sp0gaiB5i/FAEH6ios2z10jx5B+Nya85dRgd4\r\nubO63WDoDhx/UaX9t6bgWAcYIwnuUdN9D85f60j+6UDEOyKH+Cq3VXVD8DKG\r\nL7bEHQoqbbo8IhnvILihF6mUhwXqKP7dTycQ5/G+K0DPektmj8pQ/0f+aZqi\r\nCl+IBElYrO6AMqiwSgxh+X+nYRNgwYUiTOyWCDKPExrBoiScILt28rES9GNQ\r\nqRxbbVXKgR/NyKCA6X+VRzR0vCYiY2HQgE9rLY2Px5HJwty+iTGi/rO0VjPH\r\n3sE2CMwrk7IydPXbBzqwRu2bOqfhKreSaJeljlJR+nbVXKyF4N23MELrbbJy\r\nyqY7wydXy6dfXOpcntQN0eYQ18X/DkZWg7w3UPNtGrgW/dpNWMrgmkCoDaTL\r\nRzhZa9P5fXF4YHlLI43Y1xtHkvsPuCjRwKEZxRnCeBm9WodxxiwWBaWAR/YJ\r\nltlL3UalwO1lYb2q/emClhl2Q6l5hbkdNUW56csz1LIGc9p0/AAbeaM4w3lh\r\nq3iaDx4k4b6PNULv45l+0BP5xrR4VzGIkN8=\r\n=Jk8R\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"6980ddd4bc39474d1d6bc00173d7f8f8a496a94f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.39_1648676054460_0.512667479279795","host":"s3://npm-registry-packages"}},"2.46.40":{"name":"@apollosproject/ui-onboarding","version":"2.46.40","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.40","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"8a9398e392f0068929331b57567bc2246b14c26a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.40.tgz","fileCount":87,"integrity":"sha512-3DcWq4GieFTijYinYBB7BxQyyk01CSZjjptzwKfBrjEszotqanZfcWbOO0BfqzrY2ASDL7Vczg4hJeWF3jq8Dg==","signatures":[{"sig":"MEUCIBDxELhkAi1jopkq4HdYtD6Cy4bTOSKRxw99g8GTXCvAAiEAioa0S4VGnKOAUez0JcjU78n5depLpL5Eoue0ec6VnoA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":934428,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRM3AACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoQaA/9FNTVd5gskiAyRAiHGedtGu0PedkFzcldYu4Uvh/meo+blPTt\r\nw5VEEVRxCfP43VklfrZQ1SV+HY0zmbHukfXfH+wO/a9Mfy6vzN7+HoKf/Dxm\r\nCZnmiEsCLy1qj6nigR060gp87EydR5UeoSol62hs7cSIAofwoflruMooDDuV\r\nRGtz7FEd9kVcyw9uhyCPknDGxsNy4VV6as8DGqpG2JZlyCcTCceTpcv+SWLf\r\nx2PMH8lC4dXvrjIr0NsiNYJeW10GIw+3D4PzGvnjh0XmwvHZVzfCXQ4GRm/S\r\n0N1Ofx14ClUr0FwsgGu22Fv+RgKQT+susVJKNOjlVcE8RQ6BzbLeVfy9N63B\r\nlUKPGTIAZmqdJcnhIU//SssU5VnbEGu8zQdUe8pWso6p/YrYl7yuXyrgE9EW\r\nhrmzR0QeBkA1zBvCXgPAqLj8J/P/ouhtjQQhK9D6xcBNn/z/Ae/x8ZerbDqN\r\nR1VWMSAm/vKwKZeOzcbYJOm6MKAGKhXw4c/DQPJP9511nsWw41NmKwvvkkDh\r\nAqFIoLAXPXmYLfoBygeq3Xmcrd48g/WdMw1xBv+XU5EU6fYBS+K9qKHkpB7z\r\n7SREyAuBsymJTaBKAd75sSsfB2GZhVcVYxvAUceVFz6Ih8o3+JU3wd5wOAU1\r\n1qP3a0nuxQG0w2VlGgSy7zimy7em+yVDJjo=\r\n=aTmh\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"5dbb5052bafb16451f4380c4a65fb8365c2c24f4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.40_1648676288381_0.19519165871343946","host":"s3://npm-registry-packages"}},"2.46.41":{"name":"@apollosproject/ui-onboarding","version":"2.46.41","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.41","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d178189d029eb91eed4a5d25587b88dcdf6e8a75","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.41.tgz","fileCount":87,"integrity":"sha512-1IUn8+nRByen7Yg2bOW159wqbCDKUlvTnqSWUWp3XDVZe7/fAZcQyoPFOACIroVAAcSTWEBnnG2X90NTp6AWwA==","signatures":[{"sig":"MEQCIG6RkD0eKdkDLAC33/vzywOsTS/i1nt2lBKaGgeQPiiyAiBUlV+RTntkyVjN0yb/C/1fcWbaXTCWrS9FwzpC/3fFxA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":934607,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRM52ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmopkg/7B9TVDeNQqY0mM03XoT36sFbPfo6cI83/GVYlvGgNnfHUZ3K7\r\ncTFQEbBECUmDuNkd2XXUQoTPCDQV1a/ogw5HvAl+AmbC1QQFti2BmP/10QiG\r\nb/xKTm7Ks9VfGJbyrsRTmRYe2VU4dsHvlqnRUtL7V7sgw1QkutQ/16QkYtVw\r\n3dTdWQwW2q0WnuykJ/n25P2WirDk0t3mvlSp7a+e9PnV8B6z1qJNJq5K2TI3\r\nB6ZyRxYZCl40/GbJFL/BeGmaC4W9SkKWJM2KNTHFpeIaCqfJjqQJKfb5Q5TE\r\nSEBsCG1wC3vANSPEMyOml2HFhrSP1qClqrp9Jd05ASCndKFPQiatXEv/Dvyk\r\nnZxacwP0Wxkuwe5W2pU0Iad1JxPeZiLJXYBKG1ie45+lpTmRozWMI98RypoZ\r\nwtJHK0tQWDDZ8vcrnsw5MpoygEpWz+bi8cMYW+7/vPokXorsivoyHi+TII86\r\nEgwY1VE9dTU+KPpPqVa4kVn4N+SPcO8GUNo2KCdKfrpSgzK5JTZ/RA2t+pck\r\nwiTVAv8As0TW7oodSBSb87xxTaAkQ2pqur7hr9F84JSJMXelw1LxIWX3Z27r\r\nSwHFD3DRMb1/Krj36jI1K28280pApcfoBppuddiooIRWWtXdmLLTpNVdWpns\r\n5H0Jki/aRYyLsSGndmMTQ/IPtYV9yH+PWfg=\r\n=hpWq\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"8eaeda1c25dea6cc84de3bec91891665b5f469b4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.41_1648676470608_0.8963556583649341","host":"s3://npm-registry-packages"}},"2.46.42":{"name":"@apollosproject/ui-onboarding","version":"2.46.42","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.42","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"77eb6fe9dd6ddfc2827672b40dfc16f7f8c53a0f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.42.tgz","fileCount":87,"integrity":"sha512-tcc6UguDmY7X1kuO3lpwJJ3/P0g7lXXRYQB5m/kLB5xHh+/NBHpFj8k7bZkll1i/dxmiNwexDSsdQxm7fh/hNA==","signatures":[{"sig":"MEUCIQDCRgZsoF6vpCUYkAJ6R1y6DeAzJPxRVhAQM7rmAnHrLwIgebbLFyfZy2HvFoURHRSLOL9mle/CzVGU7EjP2WC6xXM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":934786,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRM8qACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpXRRAAmP17Avy1ZKVx/JCR4/fWx1gsBK7Rr/Ug0yPR0ezcJgRVJO4c\r\nuKAruUKh1kwVbiTVCa2xi4jNa3GC5KW4px/gxOMFQ8+b7VcqDjGGLkoFvYin\r\n/qwOgMWeRQJUeOA71LnX5EUMk6T+qBhCrEvO1rWZY6mzsXVzqWPvBkEJGn80\r\nTsv+y4CI0FnZPO+RIUq6DLB8a9gRmzKQfV1hzd/jMdilIuInZb/Xz+zRCQzB\r\nQ637M37RqtrzzKjZmuIkZcZylU12Ykz90inW9QiRWzsrgCUhPlTK9q1ZQ258\r\nr+KqwaU1uXlRfynpwD47QNNDZ9awWET0knVtLI93RIHM+X83bA6wfoASkrx2\r\nusjNbHu4KTNNmovZWu5mDQFxMuxPSfNMfWK8WKVe/uJCUvmQ0s6wcH52A6TI\r\nxgthyrVq1t2jA3pAi6wUslliVKr431cJ/FS/hsx6A3+LDd+04PJo8KcUj9zJ\r\nG4hZvT9USa6vdcZIW0iTLs3rV19lS1GriR1SVI0+w6N5/TgKUB7RbK/s7ne0\r\nFMBhKZM8oQGWrjDBhUTzabwTUutbhJ3zgpa/ymIKwweykHiH2hawJ5PdPRnL\r\nW2ArshCQ1y2/tylPJYMoacOfaSn1Kva+oEGfcuFpw5UD37i49NjOJEh5DZNO\r\nW4HaZV1TnYmUD2A7rXuBQ3sIdIvAo/zftbU=\r\n=pi0N\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"e4011da83ee83db1f53b89d7cbe859b71b5353d6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.42_1648676650660_0.896947489329093","host":"s3://npm-registry-packages"}},"2.46.43":{"name":"@apollosproject/ui-onboarding","version":"2.46.43","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.43","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"279c9efcafa0a484a010da2b3afab64a6adfc9ee","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.43.tgz","fileCount":87,"integrity":"sha512-wq/9SZSQMsbnaK5BUpTxoNkvsVwF4WLww9/zIZafp0UzyL0EbsoXfzPeAFshK7ihCOK9gUCPsnmDpkz1EUULJg==","signatures":[{"sig":"MEUCIEm4sB2hj+MEO9kteAhEag4AyQLuSw4ZgZObuwH9VlO4AiEAwzyboLXmusynK++qJ5RF2S49vlcR+SFIywZ9liIQAUE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":934965,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRM/rACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrXug/+PtYluLYozWD+L0dY+Z+Hpmv35b6TMSn8umw2zIJMHgtbB3DG\r\nyvPehEeVc90DIFupG+iE8J34dpf/Nj2ffO7plB7oYDxcZd47qKW0vGPagBrJ\r\nXgE/T1JU2BioS/ZnypKmgh1VpPHcloO91Q8jIJhxDvfJT9wYsQuNNOP0hcqn\r\n8oLmcUYHvRiyrHBgeKgzESUARwTT9nnzozimJj+Uz7Gr01yo+Vf5eCZMDu1s\r\nxbBWqK/TjS8BwiAugjmtIJrIyNMhQvPjl1YmMnr+kLn7VDOzDoA3r1pIassr\r\ntbDtLguulf05uzZ/z9OikwYrzSsI1rLY/2buWEKP7kabwOhv6jrZU18Lqeby\r\n2a5jJeXKOUqfxAXq3k0iv496hwk/yTMMToR1jdTov5bFSaiEgKA4hkndur7J\r\nnuQfvn1q32g7eDTXGQM6//X1RWmiPv20SKgSLToaixPySVBRbWy1M/ZzbVDb\r\ntKfsh0MLjLqtPGJ1lCKgnYX8gT69e2DGThoI1zWGD6ioPxbdnxzjBrQXUJMc\r\nJOFkBUJsBNbrhuO1ckCxwvRhE4CVjDB58+MeSyu7s5HQ+w+OnQafzt7gLcIj\r\nB/gbTJ4kIQhl24zaOxYZUsaUP1ai4wUxxX9jHHLSurbu5tTqI7V6tey6lF15\r\nctJ4wDdi7CNtAmQFqHj5ado/wK1Qo86uOAg=\r\n=ycGS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"a0878bcdb71a90212ecc9d35f9178f1e5d5371a9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.43_1648676843532_0.2417179570390513","host":"s3://npm-registry-packages"}},"2.46.44":{"name":"@apollosproject/ui-onboarding","version":"2.46.44","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.44","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c012ae65fdf1e53bdc9ba322e8635a2d2cadb6e9","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.44.tgz","fileCount":87,"integrity":"sha512-HUWsq+W2UNU4dVjAM+jFdjIxiL4fIGc7KuH2xGkxFZpvzRqsFiSlKmvtesQsiBE/QmuFBRmbNm+/x+s1mJ7FhA==","signatures":[{"sig":"MEYCIQDbJItz1IvjujRojohxBL02onHFjbvsf8tXH7sEHb409wIhANBIEsQvn55gCLbU3rRZaurgVyUOs2YxdbpikGAc8kIL","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":935144,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRND1ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq73hAAgPLGqncrCK7oTYzegm9MaEqNhUzodfTxjlOiSJCbAUdDoVH1\r\nA2B95lH3MUbzJy4k4oW7kxAWi0vJHinw9b6DwMRsTSB2+0Qz+uTKCk8GvZ+v\r\n8uKvCzgZOajJX7i705ylXrbrtTq4dH7nUg1U+FVlVYZ91OCGkZmRZYclDTtl\r\n97Noiho3kM4wvc2Q8VL9NK9zjFPfDI0Y9DcR3aEfHSRZ+6WmzXp3Ig/ty8Iy\r\nSkYR+GX6+ZEOYxszq9bCB+lI2ELZtVHOUogpxDo0HjF13Blripsu81cynuSu\r\noBBJku0yxyTWrwNDtpOPYKohNxH0HXLJMZ2kLEO9UQZwHlQvHeGNiZPJjF9H\r\n0dYdQtKZW8nuA4uS3ynExoNa6r6BTcoKM+5VBC89rjz1xApjWt9BT3hPsser\r\n/vJ4iNjGTyk/AZl2A7Vk/+lyC48+l1RFSQ+KG9f0VoDdz3rPXWi4l4If2MEg\r\nsHWXYgwYS3ZL8mDMve33qDTFIhJlL2bVkO9CwfLzfIY5WJ3DByNWY/BK8qHZ\r\nB0i9GyrTjYq5ZMI2ShSWET/o9Mtn82WEMmTHPlIStYr6eREJYeRIXWlwxeMu\r\nnJdIZif6uPjBpeiWvFIWKt5ti16HG24Q5RwT+DIq6LkeZCxFVfiqU4Y8ODnf\r\nNrcbBmUgiGmcRlVLTr3X/4qlVP0TS88Btzs=\r\n=j5dS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d6d7b7b59a5aa8acaeb9bba44e6ecc24753bfb4c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.44_1648677109318_0.8808510851504443","host":"s3://npm-registry-packages"}},"2.46.45":{"name":"@apollosproject/ui-onboarding","version":"2.46.45","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.45","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"70e6774ed7f58d02196c87d65e67dcade97842f9","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.45.tgz","fileCount":87,"integrity":"sha512-8Hv0SZ+DmTpwoyDRcpGAq9J83Ad+rg4I02ZC82rQ2/tV9zpRwiXFZoPk+lXUivNjNCgETDBHo6z3VQ8ZEi9FCg==","signatures":[{"sig":"MEYCIQD3x25HECD6aETt5E1uOo5keZWrUlzelR05u8rALd4DlQIhAIL3hxPjurxYXc637XiZnApl57jGvlV+dsjmtHlrqCWW","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":935323,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNHbACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrkbA//e3nWoLzwdBGSgOhwF3JGjWLkJG+oiro3uYQAxomOpNX6tN8n\r\nviwhVW3HA+Iu5wIYJcVC5gt1WOQYtm2E3HnSMdvn55xjlAOjrR+2NJ+QN7yL\r\ntkMm+l9CKYhZWycUVGHEZPre1GmfFO689hNHlCMsa5413flWrLcYyamEdywN\r\nJEWloUOYRPHlPYjaPG6XG00uIqoBQG9H+6C4X2N8HMpIvO/adh43lpeAUfLU\r\nsrk8NGQaXoeiGiZFFSpy32PaDilk7dCQRUOsbkHYXl2ofCzRQ9Ib3sd/2X5o\r\nWkkIMgpk+2JWSvMvgDnk1xzUWfUD9WzEEiPUUFIk1tqlqJtTC6ic/eWOMzgm\r\nBuKJzzVc6DVcSC1iy3xaeuGzIJqNr1WYfAuMY6I6ut9hw6KRX1XJ13e2Z4dq\r\nim/uWCKRhHnrhCDpfGFqanCq+yv6ooIunKgMPRTHIGCyaG8km6W2BWhWNFN0\r\nOo+LMVAvX4Lnwhq8F7FK9LpYu1MI67rfUC4+T2Zlyk5HigmvYu53VxAnojz9\r\n2lCU0T6hP3/4aOKqsVboa28DkHGaBRK6nU8fSgrOyY5HT54GMeRqCA+cquKg\r\nDFHdpQTCIyGgkREZr0C4W3PEv2rzFSkFsa9h2gpqwTPC7PBxUPIcRRvER4DA\r\nftDqXP+sa0a4q9V/8XXAWjzrra38zD37DQM=\r\n=JWw3\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"972a304e7afc4c67bae790ac8052abfe24caf79d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.45_1648677338989_0.2386985750916768","host":"s3://npm-registry-packages"}},"2.46.46":{"name":"@apollosproject/ui-onboarding","version":"2.46.46","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.46","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9a4aad454374d5060d8c9c241c191ece5dbffa43","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.46.tgz","fileCount":87,"integrity":"sha512-M3mHfOrq44uOSN40wY8gBsrDZSb2DoAlxpp7tv1jnvAmdu2tGf/r1jh7Gd49FJbNwmzIjDJqd9quuQhQgrwvdg==","signatures":[{"sig":"MEYCIQCPKnKbZrfVDG/1pnVACRjatrC73nm1QqJfX5BLl1IY7gIhAI2c9rDlqoZn5+wNpUCkzaYN18e37d48+I7nBqGxIi2h","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":935502,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNJzACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr8UA//QXHoB0EtETImbQCPgrpgImk3W9jXmYZXd/eB0CtXFePdpJp1\r\n2G9y9omIH+/HSmZGrwF0w/NWUjhj0rWoZb5NVXzwn2FMPvCYSX0RDBDX4GSR\r\n1BGwlzkltqhZNhsHOZV+hHhncannTbltwQM+dVli/hmDNI3/UL8LRLQH1gxh\r\nD6Ugpn3mqHN5cxtlI87qAs/9/CmLaHCte8lhU5IQBVOhRsCwqzDne9OLGQga\r\nNORUOMLGmoo+xymaGdhZP85v3cLwNafzP6GELTGEjyCBr4hx7mYUeMnz8B8+\r\nU37Rm07hxudhv2cyRCeWW1Wx2ekqbPQ5RcREu70r+APAc666dqgdk2iZRAMC\r\ngRtSZrvlF2zcAUwPuVwd3Qxj/FZ2/bDPinjMKwCzGVmZkBN6VfaveUAchBBy\r\nsULaou56ZTKB2OLGWNp1bQ/4A2bd5Fr+YmaryZwJRpcv7bsTQye7y3ygktCN\r\nQ0Xj3Rl6UkQYu5MGo1FTDeXDwymA7bF+ikwy0uQ90Tx/LEN/76MkB0DOL8PE\r\n1+UKOa5HQdJntT0TeO8Sw8HG9m1CF2YEc/Zs6BssKnt+IzlgRu7EqPovQxVg\r\nPs7tj+sh6PeMiXrnFC4+y/hoFL30B1yZMA/UtSDEs3SA1VzvlLXyaWqKmKrb\r\ny5AqvRU5khMKEL/l60xTa2aGYM+kRlr43G4=\r\n=ZjcT\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"cc1afa30076883f77d159c0a884520d4fe642ecc","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.46_1648677491198_0.11581037005805395","host":"s3://npm-registry-packages"}},"2.46.47":{"name":"@apollosproject/ui-onboarding","version":"2.46.47","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.47","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"8d5df4c75ed956630d91338a641dc6592385784a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.47.tgz","fileCount":87,"integrity":"sha512-5rArV633elgTcGacQ0VkmNisy2gnnz72oOrEMQgRq230/D2tGDi9KC6e17CReG+uwPZ3JCsVyVGnkRlN3ucwhw==","signatures":[{"sig":"MEQCIBIz0ElVARwueql+ZiC/NfygdjPQrMoeQbXBkqNkNZUhAiAGw7ifQN4YXukqT4eKARRtBigxwYUMYkE+zdjBOcMkhA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":935681,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNNaACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmptAA//UQbPJHsQ4RNg9MPiqRtQTsZvhKEDRIKEZPov5mcPRbQbYnWv\r\ndwVUFDNhfRarMZXzk+T66nkxFal560sFtzrPsASmzHbL+7vnl+GUEI0zp9Xe\r\na1n8K0io9PK6VuJDuPq8IEwjpSaC1e69suVODu3MOrXedCVXwnA+PXesM9Xi\r\nGDdZVuTkXZ6Mmax/fNec/Uo1xtcZx9Q9gdjKX7VQGfB6bsA1CAnDk2Lecw4L\r\n7irb7eFukayIffcC9geBXfHlTpTbedi7WE4NUhoOa6frfE8WT41a+fIYIxPc\r\nDBX84FjiflfyW9YLB65cio22VOsUQhy6rmmfsS4gomaXRUORSQHmXmUSpMJN\r\nHUC4btcA509lL5tH5frhhIavaeA8k/opHgofbOeuwRZ2DKRxzaFG5FjmrW17\r\nIFkSB4hwp2BXXIpdCme3ns/+j+k10XkAGLvvxwmUdg6E6bDGDShs53G2EKZN\r\n4e/FHbahnzQ8vVzHRi+ITgEOq/9dRJJPuoSBowoTgWpNY2Kg39BYBFokemdy\r\nq6KfwLsRz0OTZx72aid2gZPLqIRx/wIMwuNHfw5ggKxoS/4zgckh90h4LjSw\r\nq/cir9HyovXvbx/wX4nDgelzX2iauK8CqsIwcRydLWk8qaesKcDaLxc/Wyi3\r\nBW+zO13MWHsYXpGSegMB6q4TlyJ4UQbXMGE=\r\n=MbiV\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"715bd8456371a80add4f6654bf6350c9d19f7a5a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.47_1648677722193_0.21629927168245588","host":"s3://npm-registry-packages"}},"2.46.48":{"name":"@apollosproject/ui-onboarding","version":"2.46.48","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.48","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9f44cd2b68fb87796ec593edcf17fedee5bb8d54","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.48.tgz","fileCount":87,"integrity":"sha512-oOreJunx9avixu/ewclqlfQlPGdAvUSqQf/RKmnDj+FlJyzqeR7M6+Mh2fUt8h7v9Qg3AtC18l1ygNqc6GowYg==","signatures":[{"sig":"MEQCIFdU0kReE3sXLYpuCh5qmPkL3SY/p4O08bEIeMlZZ4lcAiBntqTRsW5Aw6WQKaoqmeu3AxiK2s5jFqT4djwwQJ/wlQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":935860,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNPvACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpQVA/8DtrPqEN2+jxibq4sNRXq4WWiF5V1nngHNuqbKrrznEBVZoeH\r\ntm40Dzm5A3kYEL+AEzaHuMZ9F2E/7lt6mhEkSwvMmlKXWlquVp1lHWUu/42A\r\n9+wpth5WX7G4XkkuW239znTiZKOIOXTWFUQC1+0Q+7DD6FL5Z1BOnYr46F9Q\r\nMd/Rsawg8EDNzBJBursawTnwmlOQWoBtm4jwS+kxLu6SvAsQw7pTngEqv5u0\r\nVl0wvDxTLlqzN4RbK62BO8qoQgXtKDzQfa9B0Fgo2LQ9uz7GrbXv62dH1Xzh\r\nGqM6cWJpJ+th8kyIbOxx9gJlX8dgT2z1N5vFirhfOZAqbR+bES8VuWQCu4H8\r\ntw4dTGX0nrt0cUX/Y6UwZx5EFqA7oSaG2CS1he/bJhjvCtvFcf5vsOcGIWbt\r\nippUmFoXIhwa7qDLnfQyKQa0tJzHF4dba8auu4klCuexFmHAjOjD0rzsiJO+\r\n8QrvmnTK0KcuY6J5Gbl85oknY+rBSvXt3uWLGUeAzMsT0X7Yjmk/AVoFYcAS\r\nLWQO9U/C1bglO3+WzImvE+t3ZHcoayM/JzxZgy7I4DGelHEWY0qnPYXhyYEO\r\noIoUKRcoPIepTOYAoJ78aTdqbzklFc5Nxt7eIujr/AiS+csUDc8d2qdCjYNZ\r\nytlBbYXIE9FodP5oI5qbVsX7NB4emdReHE8=\r\n=bwJS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"723a74dc1579bf5a8face23d3defca96ed3ad19b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.48_1648677871243_0.9350326688667949","host":"s3://npm-registry-packages"}},"2.46.49":{"name":"@apollosproject/ui-onboarding","version":"2.46.49","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.49","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"69d9f73ae95e5b267a55540e0178ded862376910","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.49.tgz","fileCount":87,"integrity":"sha512-9YLVJbXXW7NHroeAfJpw1+NvArQhwA3EIkGX7Gh1MHmfkNgILxz7fLNDMzAjxVu97Yvn3D0fhjsTGeVPUCM1+Q==","signatures":[{"sig":"MEUCICQ7RAB5Ifj7eA+biNuqKVPm3OSQ+wH9yYkVSWYJ+NmBAiEAu8D7xPb4pPz7bW7jKq9C8FHHi9Y+wMQXyq/vQjEUqBU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":936039,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNTLACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpD4Q/+J0sn6Nm2liyYpdnjPrdPrN0vkSvjEM1uz0OFmQ0mQkUeWXVq\r\n6X8ImePm7hX6+mneUAR8VxrwLDhUg3L5nc4nx1ROhGib12MCs2FI7RmQCi4G\r\nPzIKBQo6X3LrDyUoF1SDAJY3XARMSuyr3+2GJ1Kbdf36wOL2KXSYQS8JvOxq\r\n/qX+vkDngQIjl2DkJyG0jUA+Ekl8Vo3+5xR86txg0Bi/6meryMPdVHkpUMQa\r\nly7i21vAv22a7LpxbqOAScfKl2UCYa1k7wf97SjzleCrXIljnGGEsNRQsm6k\r\nW7Yb4UIdER831P4HDykKpwYX7ZyIIBqnqL4NJ7SDrN7SFOdO8gLQEX1Tu3sb\r\nJj6C3OknhEKaHCWwuYu+G+u9JPl7qOO1fJGfNR+HpW+w4DGfkADL08iLBrGX\r\neYdkGcmONXmfzHCXhEd3IloVvqZR3jOCwIxdurLCfu2KPa8nhJjEX+PBOqQX\r\n79nk5zml6NMGbaRtjPjcS7zFfkmra2XbrQovKEigtvJNwJhuh5i2ntMBD+BE\r\niDUsCRtoeWBNEPJhfknxc4IvOrtiev39agotYd9qNn6C+QQDj7rzrV+4X7Eo\r\n26n/XlX4zoYK+B+BZ9NlUZOiYIqAzf/EysG08FiGs2ACxoKyZ+iW1JNwhHSq\r\nRm2Qfgvb2y9rZnyKaFnDeyETxGnXwY1XFu0=\r\n=oLEb\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"b8d8030a2ec92228ae99b94d7421d2fd3ce995af","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.49_1648678091328_0.8269582019833106","host":"s3://npm-registry-packages"}},"2.46.50":{"name":"@apollosproject/ui-onboarding","version":"2.46.50","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.50","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"021feb19cf02a4447d8ee72943ef23dfe74fb16b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.50.tgz","fileCount":87,"integrity":"sha512-n9boHuX0HpcguBHDuy4z+5hA6+LsvEPDT6N8upFJkh9GsEUVnSeKdqC+rtTCUoGvNYOZdI8b+1CMhF4Dfu1Xgg==","signatures":[{"sig":"MEYCIQDXbZ49cKtmSnVBomBOIOCoq5h+J3njy1uBRuB+V3t0wAIhALQkbvmmf3aDqFh6c5ymW7IYHjXHO9dOqy1V0z4807Ja","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":936218,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNWjACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqfXQ//U4sA/Xm7yy2CxurrYgcx/h7lQwTmHNygip1DCL6R6Qtf0EV7\r\nW5vzK0aZNyqP3ooUnOu764czFNbd3+8L2rkiNeVOChHZbZXP2S6JG8YcdQeV\r\ne1fstAcB1VbTLCEY/G7o3v2KDGiPUJ+LZ3n4rAZopfWyRe/5Fdna5FOm3nHn\r\nlbgNE60w7m6L44iA4boW2Eezo8+8jDaWGIqZpID0mV+Ridr4jB0w7m6biMrn\r\n3+VPflWK0f2MyRmpHc92H/IYb6q67c0sNqC8dBsJlQf/hQRJIfKEr1VbT99V\r\nADOqFjmD/xNs6oprpxoExtAYsKmlCZzrqJu5zEQUULmLF+85SK7dnk46yUKe\r\nD34mhvFH6l0YqOOBmvN8XkMwjnW6i3C4Uxz/95YbDsYA93RsWxJswCEGEgZO\r\n0dYE0Oh4MK8N0VPIu0y0f9ojf23oSzCSshpGIHGvWH4RPGbRxmucWnOjklbY\r\n0Xm9y0K1OLA5ys+SJmm4rter9vvWzZX24EPANI1FZz7pwt0G+vOPXxjJ8Ibf\r\nHpJ2Bio9d3uKhb32PH5A/oi8RDRmGgFoQt56unJw+igoOZyVZhK8s/P8Nc1R\r\nFzUbreIXXasWyxbomfCrOcWSAh4xx5S+mJdXY3tmQQFEFFYcW2YvIkd2PtyG\r\nBqencDL5fvzGD1XxgktuzUBc4NPv/ikyThk=\r\n=6vhN\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"027524ea827abd921e94a6115f172da35720ffe9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.50_1648678307608_0.8432174144281748","host":"s3://npm-registry-packages"}},"2.46.51":{"name":"@apollosproject/ui-onboarding","version":"2.46.51","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.51","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"37dd835fccf657d8578f82b74ae9aabe17ce5a5b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.51.tgz","fileCount":87,"integrity":"sha512-HYscIHHQ1mwvXUkBo2IY5uJVuYt3yhPW3w7DS1yk96AhrplARaN+BT7KAmgYeBvBMBrsn06yi3XG0CyZf/H6zw==","signatures":[{"sig":"MEQCIF7GNDaRCJmczuuxRdFCeX43dw7AQAX4/ECy0/DAeu4VAiBfdyB5De3lc8smZuekgmvxTaKRpRkBeEUiLAl0ovRM0w==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":936397,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNY4ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr0kg//czaM5QMvfvvXduQcYzOQ7e/wiAOqYCi1iXiurXl0eRvxQ7ea\r\nY1H26GqWXeNxtZyRa914OrTzIh5xXNeHx8v3K7HhuL3cWn05nOmQZLwePscg\r\nQXH4JuomspVZU3nAhi6LR1zXRRbG4R/+lL3ZRme1AFrpnLbg9tvCMqVKqyaU\r\nv1h5AINQ6hBdo+3uWMP0NBEA+OP9NIm6AIYwoigGG4x+2zBrATWE3fBpyxuO\r\nvaHjB7UknXVkuJLlOtEAXiyW8IZwCEDcWT9mcMEyHqqMgltY74s6S3JfisbO\r\nFwppBaUjLJoD0g2Dz0ShyEDa/c9Aiqq2sMpq+dBym4kXqrlclwT1YsT+KDHQ\r\nmknsWzXIPVjD1UopRfOLv6qdQPqfQM2X+bX6zlYtGaPXgJXKuxdsK4eaXxVR\r\nxihGYNOTHDdHGA9dbMuW3douUunnEKBkOe5K8Y4sdPXsRCBwq8CWfFfJJzcV\r\nKw8APc9RRa7bMa3VV0TJ/Jqk8VA1T6Kt+noAsi+Jr3OntQcmJpIGAql+RbOA\r\nQ5B7RkFCTLg2nJV7Eb3QHcGd3EDTXyDko9LZg2jxMNl9wD06yrW3KK5smicj\r\nuZ2emBDj6buJu5JN+IDIWSzpmrxMTW71n8qUmH/fLbPnb2FOzg2mstg+HGbk\r\nobUG1n/rJR1gHLqTiNt1+n0zs0+UGAvnwaE=\r\n=nDNV\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"e547302a92af97fc8f674260340d659357b47f2b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.51_1648678456365_0.8560018177312405","host":"s3://npm-registry-packages"}},"2.46.52":{"name":"@apollosproject/ui-onboarding","version":"2.46.52","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.52","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"be669029afb3ba32af228898f3cdf9802c0d0673","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.52.tgz","fileCount":87,"integrity":"sha512-Wgkfp/A69JnzPDSJu6TTzjyvufF6ASwpIlJ7kAnke13dveIdCY4a6XrhMbWMH3kc6j5vvBiWgNO9ZjH+6plSZQ==","signatures":[{"sig":"MEQCIC22h66ADNtgxp60hFrzkNU7ONpESnTBtKh26L5XI4Y+AiBW4tcUsQ6xwjrVYEEn48IiWaAzd+ITRUrNgSBw5XiolQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":936576,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNcMACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpvkg//XP4ELCn596f/X80hYFC3aqpg6eoCW6Cm9PbaMiAxYsdxbN4u\r\nWIR/1TiFk/Jp+odajqKQ00MKD+oltVuF9mua70WNckW937dK7Js8to+D2G2W\r\nBAmi1Mo33zu732iLY9vyINACZbcWk6msCpm6NJU+TMheCSn3azXPwUM2bBKW\r\n1L39OTTsk2Js5uAju4eG62YFrSKobxgyi9oP+8+4MSeDNWv5XhopvF7YGop+\r\nDOAzMtecWpy0BYHI5Ux10TGlEbWVUwDvEHGFBnaPIMhyWsTTvPYFt7FrCbe8\r\nVfCxSMTWfWDrTNvQ2FsfWQekrEjvClSeNRRrYp8TDA1q/Rc4t9uxQmbQ4SgG\r\nR4jI4ra7p2VzLwjtmZcicXIhxMJjj0uqXxA/9W5IlEyFEZ2lowotfJO2/jQV\r\naRdE6jqyxqg5e8S4Usv/8BPW4HhycvocqMqQkS/71RWt0IEoqVCpB6HYkCjY\r\n8TntZ3W8MS7WPgjGp54tZ6GvmAUiZvWmJHL5vrxBpvqXRaeksmNGafKgVWdl\r\nKJFaSKD2c8MgL0lw01kGn16phQ9wjSkFMXrTPeWeqC4BiL4b9F3xLceUiAO7\r\nTdCaVI+YNTOZvacES42WWNTKGFNklegCTaZkE2rqNvtlAH8Uwzwgn0F4eR9C\r\n2wEF8zzF2BWkWk7pmWlIZUTtZ8QYe5dq+UY=\r\n=JgOL\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"49a498f7b8ece38a2dd91503b362a199495273f1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.52_1648678668230_0.8756256031450742","host":"s3://npm-registry-packages"}},"2.46.53":{"name":"@apollosproject/ui-onboarding","version":"2.46.53","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.53","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"055a4b347fea708f84e1ebd6409c3b36c81bfe22","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.53.tgz","fileCount":87,"integrity":"sha512-Huw4X1gSHpAdhRVK59S0wZQPh3NR8w+yvU4pRjbeEUdShMtJyvht/HKf1IHrQlf2g55OeMR0/2YYBUZLaT7sww==","signatures":[{"sig":"MEQCIGNvdvDu/SfWYBey0vi6uQ8lQBloEU5DlL974wSHgn61AiBu7t2OD022VkxMuF8WA+K15A0TcIs+1JglPzH8+BTb9A==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":936755,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNeuACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoQPg//aIgc0cWPTLG3Ulphpdk3Siu+WDIChtivC1eSSvjn9PWHa/xu\r\nhBIjw9m+pG4akouJ/Dvtoissouq523yRz0iQbmTUvzm/lUXtY40J5g9etKL0\r\nDylUmNb5JeIFI5EdF+kF58Jm1do9fxWGJn+AY3Sp9EMvJO7wsnYIf9OHldxZ\r\n6SidPUGMZ9jCZT+SOu2SbrsrrORG3RKKwLaYIQZ+Ey+ElI0ZKT1L9tP23ONJ\r\nwAk9OT5m7yjX2tTUtibw75Hc30g/IvUTqiAUjE3jxTPwFl9ETKx6nOOCiR6U\r\ncL04gQFeuprXWqNW1lm4UL1mCjqbyANE00RsPigLiUf18BIx2ic+8nuzQAND\r\nbGGCmW/xWpHrGREZCgAlSfFDU6fukpNPrInLB9Gkp1mFQAy3awuxUurRKSgF\r\nxstpMfHJQ21y0z7KxotsO9jS9yBdRLq9qvWaf0kS+sDDqJjQedkDEy+oV3Ce\r\nqfXgO1yRVX+I6pzFkIt8L+ZKIBpfn8YUXYl6KeIhmL/8DpHeKeCfaLJZfMCb\r\nBE+AuNvLOKBAoaF6T2JBIVn6mIh5zGVuAvkTI7uCFvHN3gpAOSCiNUBy1Tae\r\n/cXs8/faSAzoNn0woVZCZ5wQQYxnfeV328srJgYbeMzJjHw+RZ8R/9K/HXSS\r\nR9MspKnixWP5WsC5crcmSOOYDuPN/zj6vA4=\r\n=13DI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"111eb7272afd17acef59ae25c1c9ee491099f57d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.53_1648678830492_0.17053178534866187","host":"s3://npm-registry-packages"}},"2.46.54":{"name":"@apollosproject/ui-onboarding","version":"2.46.54","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.54","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b5e6a68cdea85641fda249fdc3691f7755c9b1b1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.54.tgz","fileCount":87,"integrity":"sha512-n5zDfA0LOCdAp93dmUtLQvYqJP/qglMJeyLUw1ZDR9qeq3Z+WkCC0XSLi1fxImrrlYWlJ+dsbYGmnSkYmnTTDg==","signatures":[{"sig":"MEQCIFubkCQrD6xVikNApHh0dvY+fojZ6dNH7acCrTlOxUnFAiAByKpwpvC1RMENKXL2qbVRBb0mYbFwrmBQ6a6XwHIRBg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":936934,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNiJACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoRLg//QrzS0DuKOA8X5Mqi5ra15WPhvybQTNiwuabYCXugVcqKChQ9\r\n/Kab/hjd2EBjfxJL4ZmJoZUI5xNMh3/e2uVYaqFU3ECyRZbX9I0zFAVhegeg\r\nBmnFi6vXzAPPyse/9dNkRB5dHYKOmIroxu4apfGQA6FY38cRZLTosVNTt+2R\r\nwPFifLG2ve9e+hpNZmc5QwezZTyg3QuXrgZrxSWa6AF3ydMNGXg3dT/FE6sX\r\n7JfewstvB7IHveZQPd3bqEXq72icF/Fi9MqS2fMv/8+jCuybY1gKY65EbJUG\r\n/o7u+tTIOoteP8k7/Erb7FaZ4TQ2MSq4SFSa3+gNGzQVlzDy8NEOLkIyzn3d\r\nuF5EYtMBlSBs3i+6BpUuyOZAhSKvpSqU1g7DAByQLke/J+9G/nOEABcqd+GH\r\nHORpbIBPsCYfxQi3YfDQ8/n1NRXid4Di6e0rUOM63jLW4uCYT8Fqf2kt5zPp\r\nEoshgnsYC0otpRL/ElnO8lC5ZuHZup5up+mE4V/FiEMcmhavhs+Cl+rAhhFF\r\n7i+VOcvoU8ftE6pG1I+XvhHxV7qJeAF99UXAIUlYlJqNRG9rRdlaDDGvuPvw\r\nZH/WNnf6ebIh3BEB17jCGFWz4ZeFuEESZJSsmbYSNgujoUJD9q5hPbgafdWU\r\nb6pEAUX5/dNB6mDkuw5r9y+2aAEREf5FXz4=\r\n=ceue\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"82fb8e8f0799966593882a6b9265404cb426b39c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.54_1648679048838_0.9725713039948634","host":"s3://npm-registry-packages"}},"2.46.55":{"name":"@apollosproject/ui-onboarding","version":"2.46.55","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.55","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2ee9b5d862a4fcaa35fa6c8b6fa63afa48e806eb","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.55.tgz","fileCount":87,"integrity":"sha512-T5/1EUv3bDKLCEWBcrvB4F+ly6e2Sv329rWkFNlbvA3DfWKgXk64cjaxL6kQXPru8jFW0TmZEy8aAcpnRDMi5g==","signatures":[{"sig":"MEUCIQCRXT1avq9BbdBfXTq/j/GBLWVwTXfzOJpsh5BvUIbpDwIgKStpH7BzC3TNSFDr0dKUF59GwSfHV2JVNpcDX9a+72E=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":937113,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNlXACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmrl4g/9EuHB9J0O6i+jhNZA3Oj1MKioW4hfpPwk34Hb7lI13dQ2ZKpp\r\nMIQuitsGW7x0yrY5wfZqpWbrjd238ZwylA7ElcmmQHagYzuOwRjJEXf6g+a3\r\n9yFWvLuHbJSw53GxMWI9A9cdlgotQACwRbtKNPBLBipSqfN97tun2FkX5gHd\r\niZQ0yZOaygSm46f/1NxqJUDsQBfALDrgf0wh4F3AayB1tTjMTziktrwHSYnr\r\nZXd5Rowyb6Yb15cx5IaO+VVKRN8PGIiqUnUps3ZH6gJm2rWmfyBpFJREashm\r\nYBgmXMWQt8LqYgTKy6Bke+lJIZGgZW9PxnVjYgPU11EpdAu/tphXlXnYizYo\r\naYPumgxkhbAV7l2jmXYZqQVgYEKneykJtaN2T1kxyfe47h7+Yi/EccR/IViQ\r\nciUGdhkP8qpbZWSvIUrHZJpnDHJMM00ZEALGuG8ucDq5xVPOSNl18C5GesNZ\r\nPwumSObqePoeqEKYDxHLJRTySwHFTSOhVRpzGLXvk77sYuQ9K1lB9+jjWdDN\r\n3bBrg+a8sA7o0I37xoxOry/qow1XkNTqVL3Ek+La31AwCeaoUeNxhEcEp/tb\r\nS+9NbyOxjJM3jS17ZjnaWI4EMOglwDOoenI+WMs7RRFcaii6A7ZtX68vFIkW\r\nT7LzkfdbtISokKRkv+khf5leuYia9xHZbtE=\r\n=3M0r\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"19ba89015b71a9ca8b2e3dc5b92e205f5b7c732b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.55_1648679255321_0.9740208936670627","host":"s3://npm-registry-packages"}},"2.46.56":{"name":"@apollosproject/ui-onboarding","version":"2.46.56","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.56","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"52ca2116648e0937ee8a89a77c46774d6767b50b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.56.tgz","fileCount":87,"integrity":"sha512-AG4DrmeGSBMsvWo/OP8pPz6owMXot7pTlaLed/C5U5O6d4sYANMKgVoNdryMspAEhFrvAgkT3t/gumu7CQyduw==","signatures":[{"sig":"MEYCIQDVQnTVhAPS5xB/n16bLhgKVrvf0ltASQbT0BWd8pPejwIhAOdZnZahroNyjYTr6g95irVTOzrqOR3C75e0yN68ivWa","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":937292,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNoWACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqEbg/8CsNyCWSUsoD8XP0NEPEgmWB5yPHqq2WfsLoBxiJYXrJMorZc\r\nXmKKnAXEqk93Xy+4G0qqjZygzKoHLptxu+wLr7r+kJhy/u1Gv7rgnkuQg92Z\r\nnAJTd757hjy7LCnZfdyKYnQScgV23JMRwVkoq4wrLz59OPJ6v2P7JSpORBzN\r\nWUeWNQ0qpYJsPpIYMQcR1/e8K/6gZIquIO/AuU+loeEBMpS+V5WPAXmqCrMF\r\nFQNl/VOx/fieAJCqVCRBLFPNcY4hqEWfr5q9r86SL/KRWxIw9NXli9cMiZ+/\r\nTu0wQuPJiZ0E4IewzL+6vQ3jFkEBX0UK1MC7hjYshKlLWjHvoZZWYu2TGpBI\r\nsJ2e3irtnPQs7aKycN15RQQ23/FsLG8h5IjV3ttfxcC+JUSM3Bj3gyQPCDMQ\r\n21cf3KuXllYGbhb7QQh2B5cqf8OEQqh2nWx+UMsB9YB2CPGQsUufy9Y+HUH4\r\ns4xbyEHY0Mrv3ZkY+Xv3JlSbtGzcgJKiT2/Ib6qkaR1036oAqnKVv0ZX4+jd\r\n7bCKHbjN/XQFMikUDiCdSWpTGB9RNb7smWxkmkqi0Z+YjyhwEQ+jDm/+0QoZ\r\nntxQe8vSbWAWvCX6MAZcBSemrtEGYKiAv09f5tFC9RsVf2mJmltfiUI0SN6F\r\nBq9dPYj29+vmWuC9eSDnj41cBP7ZQU1o2K8=\r\n=UTwC\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"cc962daac0337cb566ce8384c436feef3a017d61","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.56_1648679446307_0.6916053201338015","host":"s3://npm-registry-packages"}},"2.46.57":{"name":"@apollosproject/ui-onboarding","version":"2.46.57","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.57","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"e289827a29b614cccbf536ea964a29c542d8684a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.57.tgz","fileCount":87,"integrity":"sha512-hw0jkHyWhnNKDL+2yhp5jxh6KiY6KIq/CekGk0KVlppzUXe3UV+85e9fbZDIDbHZ63AbxEA5o47kr82D6G8TpA==","signatures":[{"sig":"MEYCIQChCGkCfui3H+fwhBD9MyYGGJ7HdLSxZQ03LimSvknWlgIhAM0/htWYv2LfIGkyAn7efEUTGK609c2m4W/5FaBFIdS2","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":937471,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNrmACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrBDw/+PjRBxmcCmo9hP7P6YBNFH1Iv/kapVMEb7iVPhN3Qtr6Ge/fA\r\nCcqjlK8y1Xht/zFykgGOTPTsjGS8BKtgdn3pggfAjBUzgNkrOWnodxnoxZl4\r\nRyjTLiXaXgn4kf8z5JHOazgFjpkRi4XxvOF8U/Tz5+x+YQVibeenuzaAbRxr\r\nba/D8obHQYsMNKfYzK2hT8Ybv+oIGU/WtzfpCzKi1YrXXiLjtESrsBlB6Pwq\r\nPVYcoFIyljg3xFFMgKu9ubXwDFz6OqzmJcOBq0YEjcw1hp4OLoRwGtRrpd8m\r\nv+m6dcXZmnunD3KMfPBleYXYhN01qz+oB4vs8BdzuXd+KsvpWIjxl8P6IEn+\r\n34v1xp7LhwMAirNjR43g1zDmVPw4B33+CoPS+QsYznPXqPNBlp4r3dGq/UcK\r\n4kvAQyMITn2mTVfTnf3zqaeuYklfnQMq0XWhFe1HL+s2S5lt3wliz4b6ihzb\r\nyuS62AsMQWYAgQ+7/84xSAixvvHL1JY7ov9gIVz5aWiJNZ8j6tA8gxBZ12cQ\r\nwrDnued4+5q/R2CiQEbY9k0SKuwWsduKpuYaVizIkiomEWMdsqgxCBTqoBC2\r\nvLWub9mBbynIEvWUWiuORfdpkgK575koAADBNGJoW+CvjwgUSMsaw6ti5iEc\r\nIMXWgGlS8L4sAdhc9DJ6gISA4feLgeAF9E8=\r\n=wmVK\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"739d92eed45a2f3d60f6a5614741969a306c11b4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.57_1648679654023_0.28557093518179655","host":"s3://npm-registry-packages"}},"2.46.58":{"name":"@apollosproject/ui-onboarding","version":"2.46.58","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.58","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"49f4472916f56191dc26a85e2cd4b5b8fe2ccb70","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.58.tgz","fileCount":87,"integrity":"sha512-Pdmt/1nagY1Vftx3RbKlxZm8aDq9C5RiFoEKO2QphmUED+9zN7hi8EXN0gUC4LOjXkqnyndjVbh1TA+84thpmA==","signatures":[{"sig":"MEQCIAQvIIeObnn33XTAruv1lath5zKoUeQazN5t4+SE4ip9AiBuuu3kEoducZKqcouXanHIdpIQNgSVAsfUKdzCkRU7HQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":937650,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNt8ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmrz/Q/+I6fItM+sK/DRt9OViV+oBhDl/yNNDJZ9uKYXbsEFyoANXeA/\r\nEyJSdXhHWv5ar3MoGspC4eKrMG5obv+58eJM3Z6ceS6uwNX7GFULNrUggzd2\r\n4MllB6e1+3FSam9mBhDcDKmNnCUDUlIh6cpP1oGBozDA3NCYWwxpTdi7cFUJ\r\niwbuZ1zPyMaMlWn7Zg2U6R2XtQKwjc8Ft5/42zy+0HAPoff1VjbV3N1xLou6\r\nysHBy8pVgDRfiv7Ow3HrpcEzN1btVpDgunMIpb0h73EXVDFVs3epzYzQcR/Y\r\nsEpeCwDWCZ79FAOlPpTAiMIqqrRu4YeZgghSuvx2yCK9xrRmdnlL7wyE7CTR\r\nKRZvitEXfup5PgrbZQXsbvixxXRwpGmt9ANOUwoFL01whhYqRuhuEKcV5LwZ\r\nNQ035x1DYTzDOixeWgmrYmCT3oo+MB9kBw+HpYOvNhF3B41nNIw3LmHJKM/U\r\nm64gVkcUmF8fv8pYgq4ogCFdJKkmfOiii3p0NzEk+Mgvt5DugLfG+E8FmUd5\r\ngHfMAZXa77g0R0Diw4rGHdUWih66kAkDfibe35yml91CkSrdSfiAmgD2FzGf\r\n3T5PPgmmuGLVl/HI4Yl+dAxn4Cz6THUA79q0ZPbIQ1H2hcfu3nm5PdIFHBKD\r\nto/Sg4qr7feCNgs7DDRDB5uV/swyuksxH4I=\r\n=bhWn\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"06b89ed1100b587ffed022637f1695dcfb7b538b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.58_1648679804650_0.5962035321972425","host":"s3://npm-registry-packages"}},"2.46.59":{"name":"@apollosproject/ui-onboarding","version":"2.46.59","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.59","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"893e202a3e46f73b14e89170a72d3034e78f2dc3","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.59.tgz","fileCount":87,"integrity":"sha512-BSfzOnrbpICI1/cVbM0deFLQ910XcVMKqs9SCV8bS3oJaQmFxEpb+JIQYLGbqb17nT6OFPeXIQD2GzxOdYVDqQ==","signatures":[{"sig":"MEUCIQCJmQTyB6DHZdYAaRrvTWgEaadOvmYlDpj4AcPnd9zeAgIgRxdx8qdyn1an/1dzbnJbPNlGy4uezuMg0IEo3Qbn6yE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":937829,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRNxjACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrCNA/9GU9YvGNEQV1RdFt200cQ2didC9mJoiLQ5A8ciaxYqGPqostP\r\nx0l3owAFaYNkF1skHgYx8ebZa0E1v9/SZYD2MDJ3S/ZZbTtuMgVyiCJDbXTN\r\nWiUOxomd6Y4abVGzTsncdPQUtdToxKEP1dBACOyX9XgT9oxuhqjq/QR8H3Af\r\n6PlkuAT0R9jjTU7IYaRlTWnC6sNMOlORwCMMo71CJM9cwJLQwZuuCLXXLdIT\r\n/CGfHFeemvFvRxVdq045bRC/P5HDe4M1RnYAytjuZPSYLQXtx8ofGU3aVi+D\r\nrbGIwYqHWQTJww5VWx/UvErmolHMrmWcozkH7bDn6NKpPWz5fsjAhvfXL5RZ\r\nzJIfaS2o5teFwj5cENB5Js4mvoHljLebPmGHwZVVluImJHckV69hw5+p++IT\r\nQKFGKVBu6TMxCRceY1bUqdtnB1CUvHuObKnegulv1ZJyb2RanpScywiHwTpB\r\nknj/WqRvVVPXGcoguEHIiVOFIFYGxdigWHoRCYGVw54StVWjlTrZGmuaFs0W\r\n27XKNIce5ZP6skhuK62gK4wdQFFlphBe/GoQnfMQf372dLBytVnUBEBAQb0O\r\n5YwX3Z3/rQ+Ees3ARGg1sZRY0uhyxqDYpanYY6ZXzjWga9i0Y1mGQm0ormut\r\nzxM7XWZPqkdffvjfSkLnuatmdq77PN6j6KM=\r\n=wggI\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"59847b348bab05c7916ae803e783e8259fa876ad","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.59_1648680034778_0.32675204991611273","host":"s3://npm-registry-packages"}},"2.46.60":{"name":"@apollosproject/ui-onboarding","version":"2.46.60","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.60","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"18ccb30570c9c8d207b9401bbfc0db43dc3dd42b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.60.tgz","fileCount":87,"integrity":"sha512-7o+TgYoPvpYMmSr1+aQ9OoiDjuuOnMjZ0aHoBJhdL2nfRhzT/cG7DhfMd2Osf+Owtb33ZUZCb//c0+pNfLJzsA==","signatures":[{"sig":"MEYCIQDPu4qdOuITQEQex8VfbuiVV2ucXyGzFl+G91A6UU7FFwIhANpbn+XL4K9O+0AsO3E14uHO0JpLkVcj4KvvKHs8zQgY","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":938008,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRN0ZACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq49Q/9Fb6TyQQy4eV2yYmEXjBvJEVweGyuWII0Ycm5f8RHLey95u3z\r\n9DgEzLqBDPGEtVNTRiVmlUliNaly1iZx2EXK9HpayXq2i1SHSolLR016EUHf\r\nHSnfr68lQTxnYENYGsnS4IdpkCu/zM4EsFiGOP+5XSi2/lrNJARQsxNugRf5\r\nHbV91y6pPHGC7sS2OHkARspp2Ib+mQUt6oRpCvOpHFyQUMOhQBHUY6B+sr8o\r\n2BjPQgRc6SG+22EAaWwvnJ/YMYESjebXrHeulCH5qw/rXEXPf7YdWYLbk0pq\r\nCLPP1UhPVJlZd/w1wVFf2XfLZQOy2+5WcwXBj07xwgkCUgGVq5L6ZNJTmDWy\r\nIB1U0Ss6vs250OFOXik+UCUd/qqFKZ4DggzYTcR2FflJi3tuffJ9xnRvzeBE\r\nXKQLV+LqAByc1mDbx3/1E5HNpQNetLuGbCHPI13QsmTsypn0+ViMkhOK7lXD\r\ntnlbJPLRjwwu42fuUwB3C2gPo/5SA+KkP3OfaBk/wIZcJxGyTo3rVsX0EhmV\r\nNwvt0DZFf/Hp7n66WN8bRs/WhFMr9BCpQFYamti8z0sQlBYmN1cop1kn9KrI\r\nvupcC8sbeIgrnzUAKWjqLr7GcmOrNRNDROLcd0D4Dx0LeC4dF24o3QYk5nwl\r\nU1RMoGehOvOaz4a95tGVVimNLVvnhJ2ZBSU=\r\n=M94a\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"050a3f57fef19a48044a62d0803d1b0c7b4f1ce9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.60_1648680216820_0.04425882323668917","host":"s3://npm-registry-packages"}},"2.46.61":{"name":"@apollosproject/ui-onboarding","version":"2.46.61","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.61","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"032af95a08978fc72bbbd5c4e7d94c5282e1679d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.61.tgz","fileCount":87,"integrity":"sha512-52Fr4ENT3dcwoU0fcmCckpFPUtGWf1jJSCw4RpHBcG5jq6gdkJhO7rQ02qcXuanR85tNxHLnN+EXVa93OZelKg==","signatures":[{"sig":"MEUCIQCVkBq7aG5w0VnqIXb3YZpiAGdHTz95JbK6yFVUAt2EGAIgQoFQDyr16ni35vIpFbxVku/NYHi8H2k/GODYEkSXFsc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":938187,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRN3IACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmrmmg/+IZqCapEOksM74ZJY52YsG4mtdAdjnVyAi1a1ROsVkJoVyO+7\r\n40L/UtwmqDw9zYu+/hRt6Tqk/p67kYn3jIRiW2neCz1tu9h6zo9XuKXi6flY\r\ndJrHNp5JaLNOnEjWM6o3dcR7nqPLBVCANKpAaW56MxFN4U2jIAAfO6krl+4K\r\nIOgMOKnOQdu9QWt3ilrLdU/G3wgbQ/M6Ts1vTydYNWSuw/K33e2weWDSWKLo\r\nK+t3C+RRyo1kcop2J2KHx+HXvaEnRzOmCJas8rR/EUnfd9pRymr7jZJgLP9B\r\n8B+TwxomfzKfLUGD4bVJZH19QRqMXmv4x1bTz/e1ef3WWdtd7zZuWgXkhRnu\r\nErGkgwd/bwWY0/LKgehlez+gvy775EgPQCo4drxEa/piFmmWwHV/rzQ2/sDZ\r\no8B82PIv8RCqZ529PCk16uaRCA41CPyZxHoQ9cMQS7Qi12m3Yqd0Tx7uxUnv\r\nM+WXL8DLKO8Lh2bpTaP596xNTOweEtXaSpvELBR/piAAVGsAxuQOEw+NoYRK\r\nci62WXvzSFxj/PxUiTduPUcMNdKM9YnezrzuBNZ0uVg+ErL/+xO2X8FBZXLa\r\nyFpyekHVDx2G8cY9ZkSj2ifogh9W4rce2ABosk7km49OxPKcFaX0u2yudWep\r\nuZ2aKs8JI3loC6WKV7MPu/Zd9E88i3cTLsc=\r\n=T4eg\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"6c4ef822ea09370fdaf19b90ded0fd4b359eed78","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.61_1648680392500_0.9495301909114147","host":"s3://npm-registry-packages"}},"2.46.62":{"name":"@apollosproject/ui-onboarding","version":"2.46.62","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.62","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"cbb0ade1c56ce5c768203bedbdf70e1a3f05c387","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.62.tgz","fileCount":87,"integrity":"sha512-IT1tWy07NjTuTrxVsO+r7wW63QQUQwtNyu04pDwBvWGPwzXPtYc172aTNAQn/SC3ncmcrDjpckxMdlHLKJu6Bg==","signatures":[{"sig":"MEUCIG/jLUe6dZUffE7qq+jABFPeeJC8SMIeqXph5XI9xDENAiEAjXDGmyVoSibwzhMIC8B25b2tZL9wsn6aNK9Lz1eiWT4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":938366,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRN5iACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr2mQ/8DfBu8RSBzevT7gjnxmd9V/Jbo8Rv7Etx3munwhNOQp4OrQia\r\n70SQWw4AfP7urUVek1t0U/FSftyQu6SicTeiLauQWkC2djgtLFZULOegAp6l\r\nD3+baIkhiXBAj9bXRtntmTMaCL7VgZ22gK6yMcA1it36a62iQA3g9bhVSMSk\r\n5GNbkuqtGibCJf7ZJB0JTHetQeiAYYryzyyMAMwyuvGYL7OHrNybGF2dA0V7\r\nBpI8osQr7xsrjGVTi5wHls9hRUqw6eG8y6CjdA//8DRxrpBYkPbzF8Z7qDC/\r\nCxQxUTHmFAFCF1jE0PppPhyD8lsNzppvKQSHI+mVbd92O8eOa6w00PSFJj60\r\nLv4kHfaKdYOy7B+ZaDqr5T3ljvPc1OGMyfmeOamAWzRkSKQkEphRzocMgNAr\r\ngQnBFtiIBapMvwN0j45LAzDdufvR1SffuLhoKpFISsdPfTG6jinkMh/QJBU/\r\nIOfiuFXDEZxtdV/F1JKe3mYGxZ8Ki3drUSOgWDZqm3IQeNDzVUxvHsIa7dqs\r\nZsrwj569fwfF878GnU7roMCfJt6v3kUn/Ykhk/8cn1mgCwafXHx2hCUOAZSQ\r\nV1DuEZ3304Bosl6ej76jaXm0T4UFc/BUsIyaSxwPQfpbixqQThYQBXO0Zgre\r\nX5iKO8mBysgDtqzKNxvPoUH7cPofwFvYUAo=\r\n=slbq\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"12886bc38d722934aa5739f2090e7ff9bf936ed7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.62_1648680546764_0.21057715058386517","host":"s3://npm-registry-packages"}},"2.46.63":{"name":"@apollosproject/ui-onboarding","version":"2.46.63","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.63","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"dd2c39141acc292991f80f2f1e721995f2e02ec0","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.63.tgz","fileCount":87,"integrity":"sha512-9YGs8w+M/ll9Lrusj+/v3dG+XZz33L6aRXdVJ952OqQ/1ov731v57fmmScDpdERgPvIDBtt4OGsvVLqIpj4N1Q==","signatures":[{"sig":"MEUCIQDYkp7O/d3qxreu1so9PgdGcl55se/bgOrYvnNkjHREEgIgGB5HEwJUYzwmCuSRMyMt7KXz9Me9P6u6ityRFP85aiE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":938545,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRN8EACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr6Gg/+NykuR8VLiP3Quh+7MFmKug9NduZZpdGFDWGnaYNsnq99IVEr\r\nfh8/0ehRgitV/+1pCHWofysm9xsXseLnjf9naCL8laSO/nbjfP0/tV40/xbc\r\niCJlTgirVmdtjh6ojzli7l7ja5pfdV1Xs4iHgfxkcatf4i8Gx8asEOvK3EaQ\r\nY4HKaLNIwIKzJOT0Oj5RYxFNiMVdoLhR2j7iG9viYeWTeR5G4g+etW2avqeq\r\nUIqHzMkdJYM6DejBgYdgWDPEPNK98LU7G/UN+nENY/6n/wHsufhjQNANthBj\r\n5nXR9bqlCTd9MoId8ToiR5KtxsBto4fR9OC7qcL6oHM2z6oQH2naReBOBp6P\r\njJKqJI+WBcSL0fMex1t9LrUbGmi9icX+GX09sGPXAxOqGASUQqU11vDfD79k\r\n3FlpSHvOSYvNvoE2PcC7k50WJN1cIA/4MzurIBkmrCIZMgyzBhkeR70CaNmC\r\n35drXqE1piwREsKBOatz/AsuN5t9kj/pDy1iwOu0pAQPo0onjhle51vsCk+d\r\nvvvXyixbv6gyLROeT1bIWYE+jMKVG2thL4Y4Xod/+rn9/FPz6uXSfg9E+K0h\r\n1wRh6dSrEWHo5nWFXxdvUyb3WOQszYT9iRrrTIKwKkJqkesqGP9o7DfGBjae\r\n1yC208pVfWhVQs7AuOquui3aSfH6Z8wlkEw=\r\n=OPgK\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"9eeccf69d2b34823f6e946ccf9e75dd472192d63","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.63_1648680708409_0.14018962740400953","host":"s3://npm-registry-packages"}},"2.46.64":{"name":"@apollosproject/ui-onboarding","version":"2.46.64","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.64","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"031ea3b7e3a00ccd09af537778cdf28f98901b4e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.64.tgz","fileCount":87,"integrity":"sha512-VVAGeQF9MyF7V0uIERb0F5iCieRK+3/krD52bvXwoqBvffZs9J8mMg9oRNCkBOnLow6286dHr+a6uvQD1pjxow==","signatures":[{"sig":"MEQCICbv4pFHH5ljTe847nvinkMo0CCxdIJZpA00snFswW9mAiBNgNhWPg0qoLac4Rjt2QktSpCsVIk8pN3YkwZ4KjgWkg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":938724,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRN+yACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmolsw//XJQ138Xnk5ufrJ4CTpP9y3xYysi+Ug4WZWtBKzlFuemTBh/i\r\nWG9mT2mbFKuNaDZM1oO0t7g+0uK69j492RDq7+kdmC/0xG+IDR59sw374TMP\r\nNZvn9NOgPKLjPo2D4ulFP85UuXfT50Yw0NTDm96iU5FQCNED5RQ8AKk9R/4t\r\nn4NX1fCbKCk/Ia6u3aoe829gmK/BAm0ba+paNAJ4naTNorUXDy2c1a2C/biS\r\nB49nzGOS1k6bdufplMdGoXCNsXyhJ8rEgqn3sSSWRBdHpXFrID4lAiURxJuZ\r\nNj4OxLNHtel9gZq3dLDGwTgNiWoGonZBznNDOCNVGCwILQ6xMI6vqmbeaad2\r\ndz9qibnR1P8ox3GvM5omju4VcHcdjtMJwFbep/f93dBWekUyE/8WZ3qBrJ55\r\n8kIK/TqXCGv4gswTFJWqNiI/fiIHvKEA5T44Q7uakCQ203VrOZUykO9rF3D9\r\n2cgUk4a1qRjqNbwSW+hhfPXhGxMFy4FGDFR+hOna3KhPU3/7qQL2AKKYFd5H\r\nOesQrDyaqYoTtglXS263rbJntjybusqdLbWr8os4p28WZPuOxzCbuaO5nTMT\r\nSFPnRj8XRu7kcF1ycW3tLnDb2vbUvQd4koDQdvD0MpLCKYCa569Ie9qvBu4O\r\no5XPUHD2ZKpNYfk5d9MkAFWfF6w3UKDxLcw=\r\n=2Qbs\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"55669d22400dc362a438e03c2ce35d76d0d2e883","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.64_1648680882583_0.6573247124828048","host":"s3://npm-registry-packages"}},"2.46.65":{"name":"@apollosproject/ui-onboarding","version":"2.46.65","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.65","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"948bc76363acea09e1972e2ce6a25711110b9a34","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.65.tgz","fileCount":87,"integrity":"sha512-rOE5xPhF4j26MnYv4nKO6Nq32Lv4xN6g5A0AEHTr3lokPekn0mKrPuk21Hudxr32Nk90KZ1RwudiEMq7aFq+jw==","signatures":[{"sig":"MEUCIAj2b6F94WRPC0RNr9BdfEGSZW1JiA9AUWsCIZfjVu1AAiEAr8ZGjVeIqTnw9F/oOvvG0suzh8PCMEl6rVYLRPpRmYk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":938903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROBLACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpOQg/+MDwZpMacKjEFbn5R4MZ4WyjIMllQyuAw33vQWsbsU1JRuzmU\r\nlZmLjJWoMOPzgnkrZVCza1DTg6r6DV1JvY3CaE+EruirQeJoDxrAZLiYOdZn\r\noeFx4IjP644og/wAp+tibP96d03zKFvv66OA+U91Q1yLc3VgLkBdSdqAu1Ac\r\n22Wuw2Z9vkeJd+ZNrp72e9LQV6k81CKMG9NhBevBJJpdgJLhFpnvZuqLVwEX\r\nV7/bITK+vWwc4/yOoQiu62I8hZVLRPH75kwq3boixsN9I9n1+BzutsyJU1yz\r\n/BA/oKsqWtzS98i7VYv1W71R3TPykvN1EBj3vNC6fG0WaCTgxDkp0wFoQN5L\r\ng7HJoYxDq7BhpL4KOn9OhrXQkU1b5rJ6NW9k1/27oymveBysvjXycnPoa4Fs\r\nXWo2RZYfX3JExYNcIH9+qjTRHDXrQVakzatmmT4yR47ms1cACMybMscO78Fg\r\nabEK+QnxSNO8ngxZEPbgCtCoyg0IdJdtYDllmmhHaekM+xSAHW9+ZQsXKYsV\r\nn3XexBIn9O8EDT75adeEhEevfjVwAAVixdy3bTvbtLzTGwrrhRX2Dr5SE4Y2\r\npHI4p+vz8VOzmYoPrOWtcJnvJRfiLFLME//0ByWp+01H1MhqmXG4NFpPlKrv\r\nDkWvDMrkOjXA60vuWQz+eRKV74G7XFEZb2E=\r\n=jRuL\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"028b76b4d66a7ec1d21fbccb07e7f56949194939","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.65_1648681035003_0.6028964075011476","host":"s3://npm-registry-packages"}},"2.46.66":{"name":"@apollosproject/ui-onboarding","version":"2.46.66","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.66","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a180bacbcc4d3d3f323752876c2cc90383127a8a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.66.tgz","fileCount":87,"integrity":"sha512-JpTMzdz26RVYyzJYjlYEmfe3bdYn4/JN5NLbuMQ7mHhadYdZpY9WWg2GAps2JSNaPvsFl8bBdv9sUnF9YiMefQ==","signatures":[{"sig":"MEUCIHSI9qc9AaT+EVDH25SfvCOMG4FmatIAqOsKluZq9FbbAiEA3F9kUUVSZ7Q51FFMByt/8BB5eNl7jKCAnor4OpZ7UPQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":939082,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRODqACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpYag//T2M4etMpElBNZltqOz1XNLBOmNFM8lspPaHZdw9vZsN+0lk+\r\ntE7as8PqJhtVYcRLeL9yvXOHAWgG+Wt9rKNX90XcaFkqZRWm9PDsxbC/7iXk\r\njeQzE0MK9c5yFmsYrrJYArFMXyUQ1qAeUTkJovgwkgXYlanVcwMqOyOvnTHP\r\ndUkkprKe30hMneGki4FzVzaQuk+e8hGH0hQ7tqM+IBzjlbV+nBqGLJgGBMzp\r\n3K4wy+0IBKROp3TGr+6y6CySwOkBCatj8PyIaBwsg3GoaUM9r1fsF1bOCtWs\r\nFPf8LXrh+813aPRdy/026y+0Nz7F54TS9U5eDBDgW9oupbTOaQ+YjThM3zYZ\r\nIsO/l5uPWtrnumefNyJIVmLHWtdVrpU2Nk73QQ9Q/ah/ZUaBM4qDCsU4SZDf\r\n6Ti68Ipk6WrgMOulp74NRaLUlLhCjNfeanNgQLoCOWY6NXQF5KrOBMheUzbC\r\nwYDsYg5pDMAWgMiwhccY0aQ3873RNImqnPGhIIeMHXJI2bKC4LmY4gavNyaS\r\nGcZhFjqC2p2PURj1EVIyVxy+8XNc7ZiC6PsI39nD6P44NAxWvONkCb2vAttw\r\ncZS3XJMQU6HEDZYoiLHGe7/qpIeNM0n+YR89tJWXcCyCykljwRPWdwpscftu\r\nM6UvIMuBeOgPvGUIdI1tlCNWI+A8LFUxO8g=\r\n=E/qh\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"bda733e498aac0dde8a210dc065f0941b75aa2f9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.66_1648681194576_0.5564696024802276","host":"s3://npm-registry-packages"}},"2.46.67":{"name":"@apollosproject/ui-onboarding","version":"2.46.67","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.67","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b5998706ac8a0894cbd6c3a2a41b23a522c76cc7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.67.tgz","fileCount":87,"integrity":"sha512-mBn++5s+3Dxg+6u4X5uSkdH+8Om5uXr7sNSmh49bJvh23fZm7ImZHDnXdcp+9Co6VmVXOhRYZPQWxVn3TgV/3g==","signatures":[{"sig":"MEUCIHeUi4Q+n2RdSUbLqN5s8MnDC1ZSr4QA3tmcGBL55owzAiEA+kVtAordEz4sAiAFaDyh5g3b0nqtQtNl+IVTbl1YHOQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":939261,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROGvACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp13xAAgzljXtdN0NlGF550vekA1Dd0vWvn5vojXvGljTO+J6WBgLXv\r\nKHnudV4dTFbLqM8P1raDr7Y185JNO1uNuIETlfdM43aqKKSOlYVH9tAP4v+v\r\nS3D7zHyhUFB8t4NGWA5n0QH51wfSGs7QCnANeJYVsxWsu5aaDtndg//M1iWo\r\nO1XBpeN9YQzZKnHdgQNA+LA3n21jwoLqIgpwZC4jxU4WwXvcOgirHeypYdQR\r\nh6/KVSBx2H/bdRToeZLoFh9FHIImXQ+JIymJCZLJzrUF7fgifK+OGQQx2b1H\r\nTebfghyQezJJsy1dfwiQEiNRZRcu522hN8KFvn3OgJpgzAZCY6MHoh0LMhF4\r\ns3gd2Bp9unppBeLcmuBC9K3M/j5B9br+orIkGJS3QfWa72e2d8etuzVQqEfc\r\nbBt2Td3uh3UabDMFMMIIiKB82ZMxOlsZ0nIeQtPFSa3Ob7Ac0zmtA8u+ZOee\r\nEwLC17ODRtRXbgy1JMdCB9Sdk3aLavsvaUNdp9SZBycWkDCpmmAuzyQwxg3V\r\noc81PXvZn8hS3nFXqJk8TwSyhfCT5hIz8yHzj8iUZr4M2+UtdGQBem94IXGW\r\nVCAtGn+71P3oDU2NwkwGVaiXe17N6jtrqz3b5rL96cGiZHZp8rutQWZ3GGDb\r\nh4cgGViMe7IKJAoSF2PXIl18uOe+o3IlBIU=\r\n=inHH\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"fc2f7b4875b1dad439d96ff316b95bb6df934719","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.67_1648681391617_0.811802130652592","host":"s3://npm-registry-packages"}},"2.46.68":{"name":"@apollosproject/ui-onboarding","version":"2.46.68","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.68","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2334921cc6e56674612cb8dfbc92d3a8bcc653b9","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.68.tgz","fileCount":87,"integrity":"sha512-1A5Eikh56gT5apGLzQVYiAii2L3isSy8DZ/OBkOm97mQHPZfVeU3G1iLohXs0hdTFbrkaBA99zf1QTdZAV84Qw==","signatures":[{"sig":"MEQCIF0X/yZUHPvagALZt5sTg6yZepQLxiLxFwogxcyJLS13AiBxF9KFNDzDABOsXNEPLwMxeOYaEWXV25nVWc2VD0e7XQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":939440,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROJ7ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqqpA//axhAAOh6HubWkZh5ZF2l80MXgEWNCwxRIIuCUwmYQeEWeSN+\r\nLh+bT0U8aAmu979i108ykU+CenZ/zHKoV4zUsi3WvsrgY7MigIepkZlZPu1G\r\n8muqOXAo7TUImIO/5dgyx5TeKef0oZwsfTbbvYCM/GVAvb4ZRS6dODpNEYcX\r\nVOxcDIpkYwsrgP8wVsUb7fG3A/eNaVnVL1+j0/PZjHNop/n/aVzKCXzFA8Y2\r\nbV0kCP73o5L/Dlmj8Z1mNnyr1V5YAG9/kCF3mLCVdbuLtXX7wrvUm8DUjYlK\r\nwPkyT/tQGGKyyqPS0yVYe+WASkTdRBsU6gF7oJ82C6ICJ3zLaEPsE+fqPv1h\r\nA/hraKbqw7ZSFgxfNC6qtEud9Tjq65SfNiVUAgmrHBNx+ZxXgVzOBgfqI0iX\r\nr085a74mLy+iIBNyRq38OU7vgG/rLjUphMY1L5poN/V9L23yt/34YZdXGS90\r\nMJfqEMgGbVkL2PHsX3Af7Rz1nuZn37tsgPO0ERlV/2/ZELqwM8oNIOcbIxFD\r\n3pOExSG0df6Sgic2385u7BXMI/YR+Z+D85SHToIhm7G8Zonwoeg5Tm0LBsNM\r\nm3JseMy9DuRLogmz+TXGUXL9pH0ZJOZ1DKl2ctgYQAiCRo/fJ+xf/jcijxLl\r\nWeM3tES4H9zS7qXTf9qnKJUgDLwpDNwI7mk=\r\n=yOk9\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"de18872fa2058cb48dacd4b036eb361ea4ec201c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.68_1648681594901_0.7818862053790976","host":"s3://npm-registry-packages"}},"2.46.69":{"name":"@apollosproject/ui-onboarding","version":"2.46.69","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.69","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"260a9dfc4ac1991507837ebfaf6e1568fbe13985","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.69.tgz","fileCount":87,"integrity":"sha512-nQMrYv4a76zZBmg7UTC0hVgYzN6ebYIQWEonMJUgMeNQvudWgj7uAfFeLvO2/DR9KhO9t14wvgYFzXr6hbWvOg==","signatures":[{"sig":"MEQCIE/0ig4zhCKshG9QvMaxvo8spsSZrxFS9pPTOf1jM/yyAiBzCNestOMqr+y7Br9uuPqNC1YG3btVvtFmKBVnhSSAfA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":939619,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRONyACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqXzw//XcmSTFa1BoHGgpyHygW3fIZK7xPJKPlJiRrObGb6XTm3ceDZ\r\nY3C2mkYkN64I4i6/rTG1ul8c8kJ5apZDGVGJBv2ZC++GE4rqvSiDwo0tN4sx\r\noYREatyXaZIs8EfiuJd8p6RmytJwAdY1mjTqNJpogLa5DBLR7oVXQZq18TRx\r\np/xC/XvfHs4iSxvEpavnzVPekPtL6ALgXDv4UgHc+AgKmsOI2CVdpoxNtqy/\r\nfAd8RgoduDZMkeINPXqnynJW+5zPhenrFSdSmyqoknZxO7+bj7u9XyWvM8OV\r\nTAiRMSWVppD+gvcohNrByWHEZs6oGJqyJUgM8qLW3MXYlaFzvU5PEIHYe9H2\r\nl+Vra9bzibH7VRpcVSqANkVLs+FaoViZBqdv9L3QPL04+55Z05R6sjnkfr/7\r\ns1zIJqVeUIJ8TayX7WSbBni+8TF9+C94RvL/iuiFUfFxIW0SCDvjL3n6xkOZ\r\nY5EOH/0DSKnnpNZMiaXnIQINo5r3hpjRifXPwBYN5CJofq+zZCsYYRGqD9vA\r\nxvK10S9R+PC1cymNpcz2zFEulMvIcTyPYHzp+qBKrRtoX/tvaKDMOTMU5hK/\r\n9E8rs3Gl/+ElXJzOD36699+13IAgXACC9b5b5kNTQW3RNtmH7GffqwZtQTmS\r\nD33r5zj0vFhTdK0L2m5lL0YSW5SdFFOYVyw=\r\n=I4dO\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"56dfc4ea9245a5a7f62b17186356159ceaef9274","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.69_1648681842324_0.1287397886760402","host":"s3://npm-registry-packages"}},"2.46.70":{"name":"@apollosproject/ui-onboarding","version":"2.46.70","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.70","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"39128d19a9d9d964ab9fa476de9bdcbab0965b01","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.70.tgz","fileCount":87,"integrity":"sha512-ifaCNFygNc/CbcTcRDKn327A7otJBT3PJzjb3XGfS69nzibLg2vJMpNaGf7H+lnBhOWoc7+qGE7pEzP0jhJzew==","signatures":[{"sig":"MEYCIQDSy7fwjo8gRH7fg35zWyT29nVaKwGg1fcPx4VUa5bV9wIhAOyOkfR4btVXEASOA99peh3JqbMKUQDMKxVaGUrPrSQq","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":939798,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRORFACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpduA//f8Rx86K87sNErVJMZHgMyjB/L7SIKrhPoQ6C9rvXBlwvbBCA\r\n4B7131i6v60C/bjsT7qrPJIlfKgJi4mo2O/4D6nC5llxC/8dBfnpYMY/fN4+\r\nnSMILSb1zQMvzzQmn2YvcCTBctvQ1bhmSaoT474qwvbQOiljLvxhirU7urz0\r\nfAK8pHBHxe3bmbz+8QaJAVmu2c8YxvI9bh+JRpgHNIh7rKluVeZ71RM5/K4W\r\n5tuJiRLOO+2ioNfo47nWObugNzcH9TfkJbNcJuzUqV0t5ZOKPQL8k2Zv+fts\r\n1LhZxgRO+xZqedKQDI2QdgotRyse0ymJvv1ddiAF5GDFT855cc+4wQpFoiBp\r\nTvxkch4yI8oTWJw2cePH6ZxBDy+Bue62wWfqBMAOKGU14mWtm2dfbXNlaGlA\r\n9n3yLCU3sXxVsSbkGrrN1mbeoJKp9J7ZkyzHMxZtnyMb7SMiB+7B5qd/kw4R\r\nBAEYrCuhgraWKL0WuSnaHb4th6cHBpTYMGrK45q2iYe8qWQN8pvR734Ialwx\r\nSaeZqvEwr0eqbaYyKalYVZBBpRC4obpBwe2txQiLAtk8xSlQbY8LUP5l65n5\r\nA0+ftab9AJoqM4QOgg1iwSVo3xr/m99VjKiDllpjB1n0gCKzxuN10wbwkutK\r\nhY9zmvx7qN42TzPYhSaKDi0oh3NX9xRm2dQ=\r\n=p7gY\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"f09b3afe5fb345950cc9820563011fbdaae4008a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.70_1648682053487_0.09374363240676975","host":"s3://npm-registry-packages"}},"2.46.71":{"name":"@apollosproject/ui-onboarding","version":"2.46.71","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.71","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"31fe0f08e159fc66e54c2b783972429b0305c8a8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.71.tgz","fileCount":87,"integrity":"sha512-nh6B31+R6Yl3JrBRdfNgo2RNIaf9XCifPAzdoz5Peq8M3jkeiEKSnXOa82XWQbkcwpDRJE0IfZqAZbj3EgS93g==","signatures":[{"sig":"MEQCIDGHtETrjEA4JdpP+LI+Egdee+cU5fvHXep7b1p81vcZAiB0FxIWRjyPk8zT113z/zRoC+HEHSbMS5uXcSIU7k1dfg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":939977,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROTvACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqCEA//UPBYxNeDVNn45G3l8oC7P12ix9YYiCrnbStsporuZH9tYgxB\r\nHBr84SpvVM7RQAqAOVvQwsI/t8SVsGmr/nOTIqzCy1WPXxU4CFNAePbFn+AW\r\nABGF7QrSFUJxb2rPM9CMVnMtFUFFVggdpBUmVP42OquTazos7jtKud3piFFP\r\nL/djwNvAkLK0+nSfGYcUq9vOgVDGg2juCBAf5BW2DJDFpceV2CBxXzWyeOv6\r\nVN6YjoIv0zhp2qo1yLGL6w9UIigkloc4ng+pKQem45L2bmk4g7BCWwMzuzRf\r\nMVZ1vljSuaNFKxvI4uoR5pLz6PmoNxLKNm0KVWo4JkQUnFXO3tlAdyGyploR\r\nhXJePFHyYy/jDRABHByALUcHMAWEOIhU/5bcrbpslT515sxPtfsoq0220nZH\r\nHPZPWjBHnCGtzD/DS0PGeBZU2I/5fRRFH8mmf18afxNIYiL8nfXWpi6JWzgw\r\nAyhkUpA/N2cNp3mDjtAYnqf4A2PkF/thmoMpe15uGvMYRiqKxQPqSoyo2grx\r\nraxmHNuAZLj0wpl/AvRx/DnnWjx1uM69IHFPBTQvfBylBalvx4urDpNtiSw3\r\n2HDvzNJrZAJ4/9a/fiJhsyemvHtT1wzaKdEHGlB5PKUMQueOpvPGgI3g1cTr\r\ne/bqsPB5ZypuZm7gQeS7hnHxdqtqLCHpMVk=\r\n=TefL\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"bdd217f24e842848fb8c712e4bdbc6030d846b1b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.71_1648682223617_0.9794716867451374","host":"s3://npm-registry-packages"}},"2.46.72":{"name":"@apollosproject/ui-onboarding","version":"2.46.72","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.72","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2a014a24c2423efeb88355397fe6d228177e67c5","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.72.tgz","fileCount":87,"integrity":"sha512-vSseNp2WzptEjAHQLiUWbOcimHmVWmFsZ+KiND2fF8z/d/U+PnIuBz9KkhsKTKZrmxKaioAcUfEK8DZ7a4WvvA==","signatures":[{"sig":"MEUCIQCmTUqBHe6UjIpO2p4nt9Jl79aIbMC6DMPv0/3wVAfBQAIgN9qCVVj3LaXw9u3WFh8ot1BD97iOeGslYsagu71SqF0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":940156,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROWsACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqZRw/+IZUvMDppV3kbQSIJig+rzNjYUjQagDIwRxEM3edAh5Sf36iO\r\n8IcDpJFTaYWs5AB8s8N+2nHA9ycPEcCDRitmk8a9MgEEz+Po5Xoz3UOZtJR/\r\n+3/SIMXuSjn5gSMXjAcuf9xtJefPpadJKIeL8sG5WwbHe/oQ78lA51bIvEa4\r\n9ncEH2FQI44sPe/MeculP7PXvEIlKA18MFbsuyuEaKUkte9C+YTxUu+zBWsh\r\nzKJTKUuuXQ5XE2tw/4cu8b35qGSfEDW44Dq5j/AIjRZ5wdC3ezfSNNInqDjr\r\nYtzhBGTaIm5YMEvwKC/4m+4CGRt+q485w8AkEaTmdGcFoxRm0g85Nc9fycZg\r\nuwqnU0niSGAaBENUy0+Dkznd3UBGelpbly8NSJfxaS4C/bVabSFMfP/VwKke\r\n9bV6blJ+DaWu+G5YANy7UrWA7iykpvTkJGxXQ1o5wDxf3eaH5h9D4UthaqCj\r\nYpYS1rrUbXjSLK4PrK1UfGh0hRj7fU7y1yaUWYmye7Bt8YkAK7WSCD21FLOy\r\nH4kAmNMpuetC643NTK7pVaAihgvbqJZFDf0Dl4IDTnjiaZAyajwCtT73QgVt\r\npgxP55bntuZ63Ci/s8xgLEcrOVzFYoalI3gMp7UtPixwM0L+X4hHE9damA3R\r\nwKkhWSCnv57/Pg958hqulW3KnL0+n4eGpm0=\r\n=nGny\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"402fa1a293ee8169f7f9b158f75c8d669d8c6fbf","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.72_1648682412809_0.9055793957639429","host":"s3://npm-registry-packages"}},"2.46.73":{"name":"@apollosproject/ui-onboarding","version":"2.46.73","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.73","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ed7faa9dce144d695a4d5ebbf904b4b18bec172f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.73.tgz","fileCount":87,"integrity":"sha512-XTYcoi5stVeMa4qNrAmVlmrksdjUcDVVUAZd9qguqkp+HmdrhOo4UWxaoP5LrNuicFNAzHxpHA4euNtIc7HQPA==","signatures":[{"sig":"MEUCIQCzSNZ/XzDzH9u8XIJfbSw6T8+iY8OKxtz9KYkXs1CBGgIgWKO1vhyxnkb+nSU8KHQgDzrI512PS1bo0VW7kAYvRZw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":940335,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROaPACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqMZQ/9HVm2r2jU0ZY5QQTpRpsI1jYj5UwIvwAMO172BcTQJdqasgFQ\r\nSX93gR9Ru9LpPfdpRjgOYshw7MnlDbCaSksnlh9Z17N8u2cD82c4tvBTWddV\r\nDXathbf1NdwqPCfrDkkJgqC0fz4yCApdJugmgWBSRZfavsVLVEtd/LBkq1xv\r\nv30OJTTzAmZO9FHGtnVSEscbNow5A74ejYUr1Lf+F1vWCHp7L8IvjgNZB8Q9\r\niLF175zoCpSI+akz598eq/nqndgFqwx9/B191n3sRdGzwFJV1esA6p4Unp3S\r\n40OiM5RGr0xG7BnLWxphb7w6R8iA79VdneMkroQE3JhyYYq4Wx4t2xXWxhkI\r\nO023t8NSDvnJVo0cHxnbr/VDSqfJ+nqb3ZqtzOjZcRN9LsgH7A6ZTrhQtpBG\r\nz5JFrTYOkWxQ3545RVRvTBpss2Crc+3yMYYmDn4kp9AsGLohK9YBpGdPVXix\r\ne1wM8qmoFvdzKTC6Kqg/Mz1BFT7QNb7uV7ILPrNRXqNBzzVxQWLNc1BXhysI\r\nyjEVvi2SdLBuoYAwCwZ3P/x0m4wdvmWXtxmZoTy9bLOLS70b+UIevagt3Etx\r\nmIRRy4URd4WVpWCfElPeXaNbwipYlE9/rduLGsUipKIr+MuBHafZhWevXPYN\r\n50Gwwgkj2OWbJXsThRQTyFPaMsAItEE5eLY=\r\n=2dFQ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"63a0cd22d3615cc83fda57521f6bb735ea2cb1c1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.73_1648682638999_0.5159319153950814","host":"s3://npm-registry-packages"}},"2.46.74":{"name":"@apollosproject/ui-onboarding","version":"2.46.74","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.74","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c27a9606ed7ca2c5c47028768011aa601a663c43","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.74.tgz","fileCount":87,"integrity":"sha512-UkMz0PGVEhXv5K34n6sPd27GMfvCzPuA0DmHKLZhDK+7yoJeMzcCNymtpA1njb+xqiDDhv3P5qNdDyjxH3EBAQ==","signatures":[{"sig":"MEYCIQD3NKsWbzVuLtXUF2jge2qingcu3SgJA+YMm0eyoYWL+wIhAO8+GvRqq9x4YxgsEG9R3MomvTkk16W/BNQ9juRhG2FO","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":940514,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROdcACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmreCg/6A5d+jF/5zlzdVAz1cYvQZq1ugZRgh9AJh2pgEXlWxEtKa9vX\r\nhYwYiXqhqlCVxQX5hC4dJLvy1+nKhHGT+6vSeH2MJVY4UKgtBcJPazWuwqIf\r\nb1+9w3P2gfoGD9XnI2Mdh+Pv91dCn1++eSdijJ8IEQTXWJhdK/Az5dwyEZGT\r\nVr6A+xLcJy+XtPFR+Ws4oHaqteVa5p1BoI08DcoIkJOL/YOR92u4e4mwjnVR\r\nUe+HM6UC1PNRhBWfKjnHOkAc7fkSFDsT9smU9tV4zGmHjqHW+WwSHTqu+YkC\r\nhwhtSbN4KuY/Ae42VkhfORDZpqnSCwse6EtU39koM6OYav/GAk2guyu2fIHj\r\nylMNkaQOTr7e//rcZXnM6qvZlsGtqP33Z4PUzSaiQNtJbmT2zunEx4+hphV5\r\ns1y1KddX695CnbZz58U31eGrYh/dV6Z7Aba2qUq+Pg/r/yFnk3l3YN11lTEs\r\nqmWUs5SpTCm7o8AML+5IzbbwDPQkTUumP6PJXQSiRhd9fkwj5+TrzktyAI30\r\ni6XsSCkiyZghbqhj8smw/mtCPM/5yNc7ssbmyjcc1CjAC1ZYa/bPaglGDgsy\r\n/b/MgJ9yU6B6GS8xziVQbGM7/bYfNduvv70QZAz+IOfFVH2FVjiIdIX6yyW1\r\nMNekGndkYLTMq9hMgZWX/xGPEZipW9dsy/g=\r\n=jnA0\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"0cdb1a8a5642eab53593b984a21237ee4dbbda04","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.74_1648682844282_0.22460306165658284","host":"s3://npm-registry-packages"}},"2.46.75":{"name":"@apollosproject/ui-onboarding","version":"2.46.75","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.75","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ef72f2e965e321a6bf86e76ebc396aab0aa49c1d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.75.tgz","fileCount":87,"integrity":"sha512-y6awuZPhNPnF3EjSKookP2zoZIxIBt3RmKyPjIdj0uzoga8iwa6O9QaCpCQIi4sQfTmeipxC6azzxKq/SK+FVg==","signatures":[{"sig":"MEUCIAaZ91rYCdimxKvovsbo1j0hKzr7KJ6YwjWhHfotyPGYAiEA+X9tH/8ZCymyrBiYWa68ve9M/eZRQzJZv+wWoFwRUwc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":940693,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROgFACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmobXQ//dp4IWbZuprGZLvK4uRD6VMOlfUKNP7VUlazbN1cDN7kgUAL1\r\nMI0NJ2g0IkY9urYiQ8gI5so55y0wKyuu77Sin5VE5MTB06GNlmjYgOcT9wiy\r\n2Fl+5Zz2CXe8ybatV8QGwphKKYTNeiiAygDlrY/PWh2hHU3JYi/6R6JR2z8w\r\nts4boHqDncqrBxcMLW75+RYKhStz6Ks6fiW3e8Jy8zhWNWzP9TptUt0kaRaK\r\nTfCJHzzA0RB9YhI6qCrLSMf7V5aKwIVZTrSCT7kYVhXfWop8fF3gbMY2X3cT\r\nTpD0Pu7Miyi9xuvMqAWjV2E9DsEosv1MGjEt/Mc5T2RZCUflquIILUJU9JcA\r\nCmNdUHAcyzQdnbdclaGE0Rvlz1rYv9TzH/KcNfOzP1xmlOkScZ5PF0BcQpRr\r\nueG+i4V+fqirklgNZg2zS2WXhE+J93qk5UVkwNfpFuw9l2mK1YBWrzy7EVJO\r\ns1FLUuoYsJ1waROxEaHIx9r6L0azYvTHAeGVvF7OSbL0hJk5ZOVVFD1QOHTm\r\n1zHuTcLL5K1kEgz37reoI/xZYAxBnHH2dppZJWv2JtnSC+tNzvpKgrEBLSI7\r\nmfHyEqMIXr0qsXnWEX78ab9jjc/ORLLHroTaajzZBVsp8nakbDDHppWGs6Wm\r\nDNpzHXKY4uL7FHImHLz07E4R0k02u4IoE2E=\r\n=lKIt\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c8d734662c96a919650f03988db510b36b0825b6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.75_1648683013456_0.37262269798318615","host":"s3://npm-registry-packages"}},"2.46.76":{"name":"@apollosproject/ui-onboarding","version":"2.46.76","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.76","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2fa0a2eb0d89524500150c6c3dc5d8f594d0b993","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.76.tgz","fileCount":87,"integrity":"sha512-tBATpl5rIcqCraj4OXabBRyGwGrIBWP2SG3JPyM0AKz1EDFBPAuq0ZUDtgHTPxb6HNa2MHnAnyiWowxb6cvQ5g==","signatures":[{"sig":"MEQCIAL51j2ImG2svK/4DVdXKVv04hRk4OAJyF6fzFvH/+dNAiBg5NahsKqVKS5ryCilTEFVRq275GYANOMxgFTtJPqtQg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":940872,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROjyACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqMXBAAm4wUq/tGh9Oipr8Wh7upizaNXamNoBFvm7QSZIPwbBloN98D\r\n5pYHc0vwwiE1hVmeBHAwqXH/HlTwUvgWX5LEiut3E82JBTBFOdbz7ISK0xcr\r\nMwtMOpn8h9xPauMuX76tL9nrHMDFKL5c4qrpQuvmMYZTbqV+Mt91sxa8oycf\r\nfY0Fz+3iOLAVIz/se9s4gfla4A3q/hExqkmS3FI9c+2QHiKbTM8jdsplWXfN\r\nECuu/g4qp/o+0foGrO++sirIp8o0+gob/PC0Nf+gPOkRePVlvkaJ8GBtAAkH\r\nl8jpJKr8Rynin6d/qx/qYY0bkOKUZ+w35h5J7261MdUMsnJljWmt/c/DhaXC\r\nKgCixA8W5KgaZgNmGvP6f/MVj48NmsXEvdhd+U0HX4KGjc4UoubXhb1k58aG\r\nWM1PKvkf52Oq2nKjTOY7WyCSorS7Rh9yroFI/i15wQ+/lgpFIxJdRfQvT7hI\r\naDsQShJXRwWpA5t7GeK7f0GDXTBKRwBiNqkhXV0lAX8duA1++ZGh47tRFygU\r\nimhwqc1vxO0CAMErui3btdmYkPKOQxTcg0MSXNh6WhZPL6kvrkZwcvbdT7HO\r\nT2qBltPpwVL/oFTvVEruVBUxK/kX+K3Zw3d7kEYU9StAEZel5U2NROuyRzS7\r\n8XkXLcN5foL2XacUryth+I1AtcZm4WG0c0Q=\r\n=VZbA\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"79f110ca99501290ce30bd97018d77ddff6c23c5","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.76_1648683250319_0.976218101297398","host":"s3://npm-registry-packages"}},"2.46.77":{"name":"@apollosproject/ui-onboarding","version":"2.46.77","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.77","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"520587bfd9a22a5aa6c6a9443fd2648b091285db","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.77.tgz","fileCount":87,"integrity":"sha512-4R+UOTfp3oPUQ0yV7qRbztfh1+4oOOjfG7zf77Zk7tyX9AOT0OTYUGBWntYBVuaCJW/6NISlHze4Ag38XCawBA==","signatures":[{"sig":"MEYCIQDMIFX/V4hzQscJgqMxIobKpsAle1VqudxITT9S+df2mgIhAISh8Ze22+FAw5L0uEfFjSldIwu2JtZp5wzpT9vUCxJ2","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":941051,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROm1ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpzrBAAkC95WvWz/qP1wIbQWnOQHYxKGDb96n5zYLFV7AfuONnFM9z4\r\nc/+Ex8VHbNGoIaoAwWdubNX+8FC6DJbu9nYm4gOlwlHum02TM6QX56lualAi\r\nq+4ReG3RZpZwXmMcIZAs/IYKrcEVXm6K1tKaA1mBZC7FxC1Sgo1PfbJB6pBL\r\nXG9mq1L5xYyaE08YwkzuCeT4FwdYP3f191DP5u5KLTqpvrNvctFMcFgynbjC\r\nE9Tx2lGZzVQO8FffpXKJNP+fHrch7m5F/eJE/3JYMKAX0/d0d2AjPs0nQM1Z\r\nW8W1NODne2XYwn9T6nlZh/fSw06QmomLEhy96aR0DytT9LlID9v2pB14rDxD\r\nxCpBd1o2ye/4z6sq4Gr1tcjksm6VxCH8EUGMUTcR7FB+MzyxZhap47sTQEpU\r\nhbFiavraPJrMZCI6pK44i/NAJ3dKrlbcH5RBTxDAqNaC7N/1QhtHcAEOQ4wP\r\nZ1tJOpvCbmwy9K0UElEPw7jsBQNV6yMkMX5J5ypcS4bVlEcxB910+QS4I1ev\r\ntg2ok8X0SThc6MfBNj45CL+vmp8269XSb5eR4VGo1nTi9qrcorrVFNmOZb3w\r\nSX0xwkzRjAmKFxnz6o5qDSP8hKz/A2YQQA8hRhSc17oGVg5vLMUoRb2nltNI\r\nf9Nii+PuIhS15nunvb8YiNDsD9IynTtsp3o=\r\n=cfd2\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"274814d9cbc01fd32daae9ccbdd2cc3484a35f49","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.77_1648683444775_0.38984331580511866","host":"s3://npm-registry-packages"}},"2.46.78":{"name":"@apollosproject/ui-onboarding","version":"2.46.78","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.78","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ca7630eb8fd5fa4e8b75f7dbfddbeb34e48e347c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.78.tgz","fileCount":87,"integrity":"sha512-CR/wPHkqxUmDAAaAiM+JyeapYQHvwbjbRblI2ZD8M2lc2yWL69S719yJISf5JYv49pHsWkXZuLWJHK2JE6g6Zw==","signatures":[{"sig":"MEQCIAhLzlCEOnreBHTXYYT7B7BEEYI5kR0wZfnedBV5R343AiBVgAG7ffh59D5HaMlhwLa5YTgtViv688CcWE3dM72Vbw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":941230,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROpLACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpZRQ//eXG/bq2ucvvqT0XS1t56nDFVGbgj+RCJA0bSv32ghEF2W0Rr\r\n404tRZPX8E1GdndIE34yuEKx7s7mCil4DvXsTA2yDEwzPQ300IHUxie09X0G\r\nziWewErI/JnG3yPXvR5AKl8GE7qzGaNE9I0zi1LCn5xwDORKYBfflrXvQxkF\r\nlINDj00PDc+sGEeqDX6kOlK286xkPlEFv7iftc+Nvgmvn9AThMJmEhExEbX1\r\nb/toVjOC3rB9Oa6tWozP21l9/bb1p6AZlYVnxp2mlFwAVEK4iQhr52Pv0Ea8\r\nopMD/b3K/0L18iq8PjLmWXND72v9pXTxyNf7hey6xxQTQL40wmt990TA45DH\r\n46qyc7JlbrU5TYWZ92jQ0+YkIFibBFVDZoVcopPUC9dOnw3UJbbITbrLt/Sc\r\nhUNzP1sWX3Nc51R0SfOid/bXfVyCapHFck1dA7nzWIMkLkR0g+ooWC1gKKSa\r\n34cGLYp/T6oF6Sr0Szf3vWt+n4JM4Y/02LHcvRV217+Q3I+IpKMoXX1mEuoS\r\nmPA0PqsXdw7Pky992SHPvoaKsxFANDdlW4hHWvwNQZvUNhqZzzWcM/ZCAhoh\r\nxfTM5I80Pt1Myu7C6nnIE8uo5myy5Z4xioS5B1KYffkzFwhotseRxMYf8y9f\r\nEsxD1eEwNw8FfDC7Reu0NQ9ZwfpjjVdIGYI=\r\n=uOwL\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"58727343df5034232bc9d11ba4877e472e2c8608","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.78_1648683595394_0.09380680390005103","host":"s3://npm-registry-packages"}},"2.46.79":{"name":"@apollosproject/ui-onboarding","version":"2.46.79","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.79","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"21155ce133eb2b24ca16843c2be8c38839b3b842","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.79.tgz","fileCount":87,"integrity":"sha512-J2+cGG3U0FD2+jxb3UW7/kJ3sVUEtblIZ2UPfdzhy/gQRP5GUmWhgPmUpNUTuZZqs39PfJawUsEkUCfjED2oHQ==","signatures":[{"sig":"MEQCIGICoTluhh46JLvHavp3ntsrZg2tsVn+aMutYijIWgFsAiBY2ljtlKzQcy5FEzAbB35ij5FEZgLbOLKfdt7RUZu98Q==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":941409,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROr/ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp0oBAAg7twutH/DxFjIsFy+OGGUY/NGQQ9OaZqO+yfGkBPUbK98plz\r\nx9EyGoMmMQyDSPLRbaUqv5wIkdKuWjvu2ib/Ih5jPv8QJl5TpW9ZwawkBv7o\r\nVcCPWJmmhZUV7yLD2zSqYULvCQNc1tHQFIb2Y9HE/rhodbH5KPOsPBLr4uvp\r\nNjCq9pk3Cnd6Pl1tFi44naV0ENtk41t7cqFkzELKqIORebKDF+oB42fVVBNc\r\nLNEpWq219lLgLGsTZXggERPdLnebZ1Ue/KwrdPA2xnmU7DibSrBddujrHGQ6\r\n3IFeJiMlK2Oz2P45wsYReNm9xtpmErSCD6sf/2xKPBU9YGz+oBb2C7dVXZQn\r\nKV5PB3+VVG6XQaXYhQWN1byas2BVyXtf4sDq7qMI/OJIqdEcowypaqugszAd\r\nZHIbJocX+LX+Z+8JclOtsPCPEqrsMkVk2fPQ8D+hll8eGChD+lhchpryqb6F\r\nc2O9L4SckVNN7OMK2OFieif0QUeUHOH3kJtHit30y/EjZGK8PnsvjPHURTZa\r\n5iXPC+9Bb+1zbTTo4B1dOJr+4gGzxBBUiTbwcGhRcqnnP8fdZ8EbWRXjn9Ek\r\nopRdglPf1ypLCoB6HQR2tlDBKxZk1sQ8+vA1It/Ydr1kVQF8DRlooR6YfWCq\r\n/BgeNMlOpr4YDb5SyCb3s2ORoJLO6UAWyxs=\r\n=uuJg\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d82ec90f6f2ead46895676508a0cfaaee7843147","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.79_1648683774814_0.8401461349414054","host":"s3://npm-registry-packages"}},"2.46.80":{"name":"@apollosproject/ui-onboarding","version":"2.46.80","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.80","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"cec6016f5be8614c468342e5676601d7a1412521","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.80.tgz","fileCount":87,"integrity":"sha512-Jg9l6uSqQ3h3fAO2t/cKhcFqCmrXOgR6WHc7jSkBIaNuaYVDXkiFOurZKvmLnfATyisqifZ16DuXt/mVnfVPEA==","signatures":[{"sig":"MEUCIFzKEsmMGAY2u+9qHwgdoU7THSF5VF/nsA7w7ICN919UAiEApv2fquXxr5kEhZlAlGyoWXyEK2ipy7nPqRvNxJfguow=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":941588,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROvyACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr4PBAAncDKmb8cvVfnSSHv5TNAdd81b4ZjR72XhkAg76w74s1ZHb3r\r\nQ/oP6uDkbMRWPi4YeBihk3cxE0kwFxp/QAS5lZAt9bMZSBF+gCkgFjWdNs/a\r\n0yic7Xc8bk4oJqOSaywvZh3Ou/tPO9uL33Cm3eaRZJS23pccetKOaxeRtFcB\r\nT3hF60oBmUxRzR/W9R1jlBZh433xdwM7S9x/FPjJYrb/aYA+OotLZBzB1vvv\r\ny9cDdtA4uwnRsATu84ef9hJPXWDfYYOtSTKSB4c5VFVKE2BhbmHGBPrGaSxi\r\nj1n3VyXX9VKaO3tRfQb8syQkGIt1RQM6Hx1WCsaEKEDnY0GXEupUPdukIjyU\r\noafgQpovEKDIs4JUdZGKcoxi1ChabOaARv4ZLa6B2FadnzLSrDxSHPD94FZd\r\nJsJsfpd2JOwiEplgE5WmpKIqvFkAFCvI77bUQ/NW7LKBqIGSuVe1jdHAbKaz\r\n94eloSX4N/7XhDPCOpT6pjxtv8x32TYF7kmnugSkmROcISeI3nGLvp5zEbPz\r\nMNC499lGwzWqfjWvMYhYmM49yQcg6FlqFID/MU/cpQmpoDX3MYUAWjphbLfu\r\nZ1Q0yTD5kLuWglDuZSrKZnvBHS4BhYoCFTYyzBlT0gvBiza0206k5liEbBaC\r\nj74G/bZBgWdVBpM1fJfLNLeUGUVUKtEYirs=\r\n=xQiO\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"80c23f6f44bf0120b5c526627fbd51626c7148e0","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.80_1648684018196_0.09752264164682578","host":"s3://npm-registry-packages"}},"2.46.81":{"name":"@apollosproject/ui-onboarding","version":"2.46.81","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.81","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"964a43ff5ee6e9950aec2f4e95ef1446c2b6553f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.81.tgz","fileCount":87,"integrity":"sha512-TM4I7s/ynj6R0kGifmgyMULYcLSO/ugm/YgIR1W7IOoZA6C0RDKnMfOXs8DRvXMm617tWoWn3CnnsrqggvfiVQ==","signatures":[{"sig":"MEYCIQCeP4fmk3oFBfziygUG3/yHUrAIE+E5mDf9f/ZscWI6bQIhAP7rOwJjPVQQWxvSjvJwq1bFo82qxYPr3Gmo9LovIfnk","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":941767,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiROzMACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr0QQ//dp+zDdX8MwYhLVmFAWTAYIr+Op4cMpim5yLmpPTc5cb4zsNS\r\ndve5aYC+ZfUNERNFdHjD/6vz8cHckjukjufHfC51kc0ihGfM4JWupwc+Gu0c\r\n1JCUgZDBcPMCUoKRSHpmdHLxtnm+cJrj6ZrVXVjErvKJo7kq2lvO3uNbKliu\r\n7TUr5HzR85yFaFcAF+CMhasB2H2qCVcI5qaD0QLg6ddcO/oYqdZ8DpMYZAm7\r\nlbmoWP0//DpJoeJaN1yXPgxi9iqIPZmAx6orcdLXNGmt6BVy2SVROHDDlsjZ\r\nftHWGH9HEoOBt9NdJIjVrY5RacQtszM5VO8IqsgtOfIaQ0q5H1LpR/ia8W73\r\n46/aIZXW0D1bmArhKve2ZHXcp2rESUjwV8j9UAjSSEWd6mKXq6b/rqbFXnsX\r\ndutblSVZwcSIdWv75f5hMmuThcXkDuxR9XolWTxqplOzJGUU5Q/aTL+xFY+s\r\n6PziLvfPj9TBFaa3jqbiuo/vnKrY/mi465qc+i/AbaailwCEZ9OddcQZtqoR\r\nKBerT4dPADGcevujwFZtfwJgk0t7HVjdcQCoFzBVdlzMduML2r9QvMfBSC+k\r\nv0izHjEll+rrUTmhTMzBAAGEhuK8OSC9OHE5NR32kzQcSIJ1TOHcmZ32/JEP\r\ny28UyOmb2IghHFm+fUWGsjBd6QWV3T5xzdQ=\r\n=nQvM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c6b3ed4f0c6f42f509f4995fa1515c232671c2e9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.81_1648684236752_0.8750973250734364","host":"s3://npm-registry-packages"}},"2.46.82":{"name":"@apollosproject/ui-onboarding","version":"2.46.82","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.82","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c4e192e05beb5e46a1852f2f117d457ee9c89088","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.82.tgz","fileCount":87,"integrity":"sha512-knG5OjuZuN7r+9KagOYTzY83yKFzoopLp6RF6bGehSfF+zdfs8l3+lVFeNhg52+r9pXfs0m4yCttWgdvH7HfTQ==","signatures":[{"sig":"MEUCIQDWd4nSPenuQooUEv23xCi+dKTiJE7y1tk6CX1MZBlO9wIgB1j9WeccCsL/8owYQL0ZgdmsBAYxjvLPdSdIjiM5OUM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":941946,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRO2kACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrhkA/+JFJ4gO0UNguYaz5qMBbbL39yTfGIpzr3CI9UszyZrkqotRt3\r\nK2A2NNTcnpS8MhGNIwa+cVjtasjYy0c1onMclWdFwP51P1jvPZcAIkfBzd2w\r\nfjria0t5478j4StLf7+G+3CCav9xep9bj5sUqX3tNWq03kSn+jDaCduH0Pg3\r\nQRLuycdINv7uVSapmP/GbXkyRdJDpKzGsfB8eXlvBbhylwdzNebiEqiMmTCW\r\nyRa3j8AjKrsZaEIxLZ5unr1jVXuDRMviVu6Hpi74JHcq+8BFlOagV6Cafqk+\r\nStfO9uTRo1kGG7CCg2NRZInzBnn++i051UprkwluU69eZ1kKI9B56w0uisWL\r\nrlIGp1jlfydshNRV3BCfNNEZLDgV2/pZS6GSvYR2RNOXF/+3nX62DbaHHkMg\r\nTeKlyidfz2gxMUUNHLn69NTLYvoh2lYocOjeByO/bGhyUJ3+qU6mYzfJZPEn\r\nkqd6Yyp5J5sbN0sSoTD3RJte60/FtOKijCQzruwmQAud9AuNsDRM6ONG+y+U\r\n9tYCpc/JEXR51jGW7+Vi8TPwStNtr0Sa9pbZLzHiGj6GTpXQ5u/0M1/ovnwW\r\n6NFuqXO3MNLLFqFbhh/bW2t0KN06ffShHaKNC46XYZj+MPTTiv1xAdZxA3pM\r\n/H5kTJs/pIcUJ3nZzINzA52Vwlg0MQgKOg4=\r\n=b7kj\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d832670e217cebe0f5a881976cd729ca06ee76ef","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.82_1648684452469_0.8407331286492621","host":"s3://npm-registry-packages"}},"2.46.83":{"name":"@apollosproject/ui-onboarding","version":"2.46.83","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.83","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1a209da58e881abe05f71299633414d550f649a5","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.83.tgz","fileCount":87,"integrity":"sha512-wgWl5hOnu0u1gCUYV7D+XBlavljXajLARqFEybd1rBC7VOkPkisWhvARepf5Rn6NgP3qwfD2naHIfgxNdsSYgA==","signatures":[{"sig":"MEUCIBklzJyJR7zhSWsziQzN4+j/8QNPtu32eaLJWoT68TVZAiEA+sgGH2MtzPWeSpVyGw5J1F2QWC/iiVzLQ2xCqsQ2SIg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":942125,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRO51ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqPJw//eUntc6h26GWAECpwZU2w2b6ry9lfhPCQj3GuY6J0G+ULCbea\r\nMloEYHiJ+8m2LNp242eimpzEs/rGM6eqqXBJgK83FhyEQBLxiN5yHccIKecW\r\nA88+DNv8c/eExkc3zIsJdxF1GtjD2MU6qZONPLkDl4gPS62gqfUPG6UAcU3b\r\n6Lhsf9jG0QYgjJreh1QLs/6WhB+VtBrOKp0V7NhojV40lN9PAepPB+rH8n76\r\nwA85Rl6+sJ82SpGtNkQlKbSLG3WLGnvsILBjeVjjsElwQUoaNdprMA/0W8Th\r\nX5s6mOvoMSY/UZu+IpIYhjAnRuCbYI9RDz1uxRnfiGbMGn0zwOpJGNCSCnW2\r\nNz0+RLdBxavhx0y0rO3gDfbHw2RUEpndA63/1jqi8YF97+fuNbrcyalfhRRt\r\n57eD8TxxLkXmK2tAaFJ3FQl6kvzKvP0i9MbqRSBUwDolx3Y8Z76pY4aE4+vb\r\nT8z8VZoRTAzGxtRdX0Shp0KsUrhJLShFFHxIKNszOOtkzYDrwzMNUZlm3ZVz\r\nEEhwYE0KDZ58Ay7NdAgZI021D+svExTAj6q0uThwGuJp/G2mEc9/NHtKLdfX\r\nBeE4bfKvDvTqlIA+JlHTSfXCVT4lsG6DtN1IcWo3/69JRP8IZOfWCInF3Pr4\r\n8lw4VYQeiDqkVUyJIs2qdDBhAka5WDWoBWo=\r\n=PYTa\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"f8762d4682079974d170b34902068f5c0ca3e574","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.83_1648684661209_0.6326259764213842","host":"s3://npm-registry-packages"}},"2.46.84":{"name":"@apollosproject/ui-onboarding","version":"2.46.84","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.84","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"36abd9d40ab96a0f4965458f0afc3793eaf09bfa","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.84.tgz","fileCount":87,"integrity":"sha512-DLXF4swicTDx0Hhs3kGRIfulZ6vuKXyHYZF+NKTYDdOb68q68Xzq0Ww4XOgafbV7xY7aFhZfHyeqdH+1SKiUeA==","signatures":[{"sig":"MEYCIQD6ywhewDpq9TAkHvWkfa57+REckVxqi2heYUXn5mN8EAIhAIH1e47sAa9olF0VSz1RSfnW1XJwdDXhmJfISPK7EiIB","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":942304,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRO8BACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmolMQ//flxJvI2+O/a/RWfKMlb0jEvWo/GlSvqOmRPyQXAmpnsYnT3p\r\np2Hl7Mp26aHi5Mjlz3WxBbJg0eXHo7rbbJwx1QNBMS1obqzKxznLaS0Vey/5\r\nfTdBgh7vJp0U0FpAHgjQFDnVEe3P+zWalgr+U38u+C1nRJrUNzBdZrhT/7si\r\nhUiwLfWv89LDHM3uLZ//B5qU6CKxtEGUvba+EtnEoyqdsTPp9D1WIcoJQ+S1\r\nFsR8WFMQ/H8dXZ9ZNcN6+pnxbBAcK+USuRDpVuRhnhFHBc8RWmDH2e3E1llp\r\nq0hKfs3FTSc8QTKWXg1vTe4l0XAlESivUobNHxfdXN4W/ul9KwFu5jva5hmq\r\n7QlzPH1LV18QZBYdX0L6qyMgOD2VdtT+Jyo5FvSf7dlZ7++mgpdeHJbAFBQd\r\nlza6NrhWo/xYNg44hc9oGXNcqe6SpRDwWUK3BVYu9qwS50wIpVm1D98+ZgBf\r\ngM13mHCs6K2EAtMLcxX9JIjpMzGrjZn5U6J0oSkpD1y1q6r9Gv5os+8Mlrmv\r\nKQeZ3nZYnFiR9wz3ms3c3TYrx5sJt9Cq/NqO94tygfSllUApXD5Gmw1beEaR\r\nHH4/20pTVoly+zGUJm+eXEGaC0OoZ79nOzZMo9nYtMiW7B3O4AXIv1/Q9lw6\r\nROpE8R0mvKyi43auvRmm45p0Lqa8SQkCF60=\r\n=MJ1j\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"6fdeb4cf4cfb09bc57a26f370e27ba1b07053ae3","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.84_1648684800950_0.3570911884193442","host":"s3://npm-registry-packages"}},"2.46.85":{"name":"@apollosproject/ui-onboarding","version":"2.46.85","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.85","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"0363ad9eae6f3f648400d3d2f30b78272945298d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.85.tgz","fileCount":87,"integrity":"sha512-oFtJMU7aOzhM06aYnxOFuAgDZRpQLPo87eUSkOVEYBGbjYpULDwKewVbfksfvx50mga6pLSrPvsKUSzWYlY6xA==","signatures":[{"sig":"MEYCIQCokSGM6oa69+o9o6U8EcycW+VUE505N2klIhaUnFN1EwIhAOXVxvKMH8LeSJ1ZK8uMk4LMHmk6f6myXd+kSyBOGoTS","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":942483,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRO/gACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpRZxAAieDWJKXDlgSH9rhfIiQBeZ4vjc7F2uIIv2VmGraTrZ9DK2ZD\r\nMx88wHln0o4RwNq/imsGyH3RCvPzPxdGbni2P3S4SuGhYfsJBCTShWi8Onqe\r\nkQNdF7c9Lq0hopUvkmVSkAlwQ5hpy/wL6cQ1N5yH6c7FLC+AdV+uk5McsTSJ\r\nftu0XRAFdALyucN8hCOdPkxm9r4z2sB/kCAi2tUSmFBgCAubY7WGXP0vSRy5\r\nqX5BAspUCFXlQQptH9gU+Q3QPOjIeaEv9rdlwhXeavMvbaBuk5Z1LKBAfrPF\r\nTqiylD/1UoLQ7lH52lS/yfTP2UD/huTRyiea46mQMxLgtRbrria4b7eXlQMp\r\n/kjOMhUYNp1iK6qWpl/d20FTR1OYxB+aDw35iZ7gV1miC+xhDjUFugxZz5A6\r\nkwezEYYjQ/+k4rnnzXxxrLVddSjTVV0ErU2kdX+DevjuZZAqDkwkpzq71Ch0\r\nr6Tpu8Esr31MhwNRFOUor/CMzpj730utVywr0sCSgb71tYhj11dELFo9cbWn\r\neO6pTp3Z0nC0oDhkjUy++5Z3Rkq7LCVljew09Fbdf2o4hMxA6Mv0TM7nPEgU\r\nlYcDYndCHsiaZKYzQS2Y0okzSDklrWKptTrEJzlp5BpTuZncHaj0906ZEwcV\r\nf7CzI2Vt3rq6Jab9gmQ0DbvO2UD72oHxa30=\r\n=EV1p\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c1e07b33645d88f776eb3b6d9e272a4e952a487b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.85_1648685024520_0.9351302407911386","host":"s3://npm-registry-packages"}},"2.46.86":{"name":"@apollosproject/ui-onboarding","version":"2.46.86","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.86","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"97d29c23e0032b3cd97c385fdb59f598692e62e8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.86.tgz","fileCount":87,"integrity":"sha512-uMuooJv2p1yn7+ulmeLUHUlmOybaic127uXwUfYfbyaFcYwZJ7ETeHF1UMPZUWwgK+CQvXQMI/wGEESycd0zPw==","signatures":[{"sig":"MEYCIQDKT56Fkq0uhUXUR77eHz4kILcYxr4M1gUkqFx5NBVvjgIhAIqS6EMwLC+hXBt9afdNf3A27i4wcikTHfjshUTusNAo","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":942662,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPB8ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqgqxAAkEHr+QT3M/sBbeJs/yfjB84PuyZ+e08AsVEtumVq9yjAn6WT\r\nNW4P/j54hKB9fXct60u8971PihYwTfWWrP65wyMBWQpOTWvXNQ3LojCavoLM\r\naiITEz+tzBQvwr2YbFBuegDsE66CnEjIW9lmioRlV8tJFELHm0YK6HoRxXpE\r\nSzTZzHIgmyHqbLuyAE2om0n47IpjrhjnNJwd01FEL58EdcyQdQP2xX/sZkML\r\nBU+82J0B8nl+xqmpa8SW0xdnn9NoakKriX3m7lhJCmDyIUDLGwKL738hhvgj\r\nGFSN0LS5Fvl2B5MOdWhbZ63mhUei4uFUS6GdLd7vdQV2Eea4b70+lIcpPwAG\r\npNQ86FBq4PStqpDYU+OFoDAv2xZObJpeelmHqYXWwSVzvkQZgd+OM+k8ft65\r\nbEZuJI/KX0mibNIdb16P8mChZF4+EQPcsh9M4LdV+1BwfKSMbYCR/33ZuXRm\r\nqFqVUr7EaMsT1D4FwlW55fWHQP267etE5XX/kP7/O8JUI+f8WtYJml2AjJI5\r\nTTEFkYdc1XnZpuPGUB2CG/IwHqgKbtI3iXMy8U6EWBrEkavV+RyYwR9+9zcm\r\n9GCdu9jp8c+mbfYH4dEleMp90ZNGOOyTS31P5EVUyytXRf9pg053hFJhN/5i\r\ny+7ei5FlnpWSpMVqvMzlwEQeVqsaMVp3er4=\r\n=kVHE\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c9ef94015b9e3b77cb139f33638dc97c7a25cf74","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.86_1648685179864_0.07857768765293183","host":"s3://npm-registry-packages"}},"2.46.87":{"name":"@apollosproject/ui-onboarding","version":"2.46.87","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.87","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d8ea12c8bdfb71cd360e2c259ff54127e8bf4395","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.87.tgz","fileCount":87,"integrity":"sha512-ZRbeA6jC7LG2D/npTV+T8WgMZTzdL7kFnDvAz5dlpumJ8lPlzbcXr0w9hopNISDaGc/Yu6P/nSb/+6AUGx5J2A==","signatures":[{"sig":"MEUCIFmQVqiAMx/GQB6mAe+dET1VsF4Hota2gv0dcgQ2IM1XAiEAuRd4Ql4LC3buAtRmpV2KY87tU5pIJvz/wXz5SILHI80=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":942841,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPGjACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqDOw//YyzpysxbHqsAYK9nHS3b8f4VPWtn/I2YAlHfKgE1Y9NXoLhC\r\nHmY1d8003hP1jSj861Zm3BvcDXWVefTenMMZiZVbVsCExEzHqGwNVEv3u4Ba\r\n5HYVBRbc1tYjBvsSWBYTOuNV0Ob+ajkjTpiV0towfz9Zemc55DcK+2zD0wB7\r\nWPYLHF5ltQAfc5SwOlgrP3ygtTR8BxzNbMWnToM7+uGC1YfMaw/83cSlw5sI\r\nrUGzgQtaA7D2aROz/7ybnOq1vWmHJL/NrxDA71RwP8W2mleueAQ4wjaF+au7\r\n28pIhEmtiZ42u+zugfbr7NXFxVmgmuBUNdchYi2cSc2xXdbMMecKRP2G9/Th\r\n2gi5VX0i1+ELxpHRboLzToPejMvnVTGWQ0pCW9rXIAHFG+BBTdBrlvWZBLRM\r\nqrk90Qjz/6epzyPCrlkwh5fSTmOsu+LVHjwgWOEVB6Js7jic8rhkYUI+gnW4\r\nk4sD4YZZS1jQsbntFxHVUSFqUjaQ5sRc27dr1+XTka5GuQeQnncnZF5YtJM+\r\nHbrtvhniYYCUBrZWe0p8ZE+MGplDaLuNv4qODEwSUUtec5wj/07AXYfRwQXT\r\nkFieAHHlqOWlvwnpOUQcmEE5aCVpt4GV0+4X/csTO2PVDJLgJGUr3SueAsrb\r\nIwooBAodD0GO/ltT48XTM07R1ftyD40v1eY=\r\n=NGC0\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ec45f8559f1e4b86c45b15955d031baf64e92a7c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.87_1648685475111_0.9453396272352113","host":"s3://npm-registry-packages"}},"2.46.88":{"name":"@apollosproject/ui-onboarding","version":"2.46.88","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.88","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"932a775c0afad7042e84414ecf49566485f4d76a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.88.tgz","fileCount":87,"integrity":"sha512-kBQzIdr49uGRgZfeDe8NGzW+pylCvxAZt6hk2YQmPP8DHYA9QZlw7BRzoCjKAikI1y59ZsFOhFIKxZtjiF6WAw==","signatures":[{"sig":"MEQCIDBhtcGPLaC7eAJhj7mFx92LEwqhKth+8AcdDingB52HAiBX/+zVSsBHYMAy9uOscdO3m1Cg7YVXyLiIoxydvsQoBA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":943020,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPJZACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoOwA//RPtBXvzOAXV1kg8Q7pEM2dbLHxZKb5PNj9ye8Qc0j43lvOf2\r\nrkqsUM8+lblABuYwoj/DGS2I/RP2SXpNNGiE6iSBU7F6R69Fm4TnRizBsU7B\r\nAUdb38xqrWWija+4BxL52/y5yjEXoQRCmGSEFEyjbv469qAGi/rx4IQ1KWUD\r\nloZ5l7s4Ws3jBRnZi8HtYTsozupU/2vtRpXZzthkvgoi5dSQgXug+bcORHS6\r\nO+xbzfV6/+bStijDXYXnBoFvEkEg7LO7LsgbVWb9jq0KLejc3aRaalZeWyoX\r\nBwkhcgBwiqVhogkTjNB1nn+BEZRYfwGQxpOimasYGVgGlEJUdk/xSxGBeQNg\r\n1LdAWyOksDcdPgXhRAVjc/HTg3BqS7KMsBMI3tY95BfEcwNS2tFjkfLT2MeP\r\nEaX+KPUxnwK9NI2KYIy5gg4w8418YvHcJdk95lZ5xizi+p0wOoZdSjUqNYjw\r\nssnzmRdhDje1KTA5UKqtPTTZK2Er0ouw1bz/OnX3QtsK6AaL+oC8Lr6hzsDN\r\n4H+sUb8YyZppxwjizI0vXljMDxA71oh+IcPnVpXMFsM2g+KUYBpryBfkhZ38\r\nVGy70+aElmV8BiaqAV4zGnwR6Zna5Lnfe0LSGinQhPrGoWSZVAjmD9UtHo26\r\neBI2vpFys8xEV38WGAvWUohb+dt/bLmyeY8=\r\n=tLFQ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"0f18ead3d3541c288630e10deece6d6b5827c8b1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.88_1648685656905_0.6598696372420729","host":"s3://npm-registry-packages"}},"2.46.89":{"name":"@apollosproject/ui-onboarding","version":"2.46.89","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.89","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"797c5a0cde9ff66ea46609349f31ab8e7edf18a3","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.89.tgz","fileCount":87,"integrity":"sha512-BcEn46We+bQYgxHfJDchQcOFEmJ5hy0GW1dLQm2w+FBWtjp7FjvHx48DgcpiMJxG+fT2Xk4HdM+Fzf/WnMN4aA==","signatures":[{"sig":"MEUCIBqMiQisl1Kxz+6EdPckoSaZcHDLPeDuyjtP3XVH24hgAiEAnMQZD/keEAZVDWmT5fYYtSs/YP2wS/D7zfEEPtOSqUw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":943199,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPMqACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoFRA/+OaPImjAuON7YuJOaRLiaAV3ftfz64hEPWGISAW5eC/Nmwh+X\r\n9/ofnqK00asaV8sb5G+Y+RCUX+6esUEg0Uc8RX5HT/NnkPRV/gUVxnzbZ/So\r\n1Xc+arA8vDmL+5gbnf+bM2Kivvrz8Pdmk8ygjnrObjp+kdGDb8W3e9crriY0\r\nffGJEFrVSA+uQ/H60+Niv2tbVDBU7m1LhgPpflVVPSSiQpc6FRldFvPThfh5\r\n6sLd7pz71FykzfsJvuJnS8Gg7plHdOlwIERylZEgyJHvDKzzbG4k/Wh/aOfF\r\ntIkaN4ggxOMkjlPYanH2qIlOkFWAxXp4iNtPqeXsgfnO2lWUtgi27KHj3mMQ\r\nEIgD07NWO0B/3vwuBn9ztmgmakotOmZSJW0mDflqbDs7OyfoExSlIhhna6te\r\nUE3veGGeKnV4XizQZ5BhTVnjzI0t7J85vWNhqRuItDYIZSaec53dTp2fYPFY\r\nUbHHnVtQ+ESTV7XxZtVM1obQ5KZdID65h+wK5R20tHtSJryHMoWwtzFN3+XM\r\nqUom1ZDJ5eUJ776EXtWWwdUO0hB1USfhZhv/KYDDlCwd2Ti8kONcDAVRxWYj\r\ngvtbOPdp1bBb63Q6KGLV4Q4i/A8hySEs4xAsXgTRUQkdu2uAFHmH258AjzUv\r\nPzcJXPLT+gwPG0oYoqOUN595MtDplIIMYTQ=\r\n=8dnU\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"8b56fc0d8ef506867467465a69eb959a5ce7462b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.89_1648685865993_0.8124383913803197","host":"s3://npm-registry-packages"}},"2.46.90":{"name":"@apollosproject/ui-onboarding","version":"2.46.90","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.90","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"11a9ca21dea3cce8abc4fdf826b6314617c36bce","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.90.tgz","fileCount":87,"integrity":"sha512-Y0uH5VWdqrCjiiaOs9KC+9Ti4EzYWuEvR+9We1T2BA19p6RmzsSa6CJEsyfu3TP8Ye2Zab0mG+ce6oRxGdJtvw==","signatures":[{"sig":"MEQCIFVwDWuxRIe1v2uVsnjiwLEsBvDTmwLJIYoYzJQd1/krAiBbwIMe1WeZ6E7qA33P8s7N7K/7ZXh6A5kOJZaD0ZXolw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":943378,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPQfACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpj+g/+Pw53qnwj4Awl7fcEWnohyQ53eT1n+IkuRt5AhcXHz7SP6Mxh\r\nSN8HvRWJXgOLVp6Ke1PUjvjVS+XcDqauqdE7jvnDBojuSEmwpf+HceQLo/vJ\r\ngSAO52t0Av0vO380qwRNkWf+wd5ryFtB0+11Zu4lrmLKKmc8bEHCUqjDBnP3\r\n4l+BB2i4wqg7zLiOmxa5ARNpK3wXdyyhQ/OTRwnIVLmEZr8i7U0jfY5jFPUw\r\nRAVnsC39jzauxHFUkyom5745znzPrSpvf84025RsMeUDCr2H2PefmRX0V5YJ\r\njzSR1ALKwuE97NYrGSFHzQRZuxFgh4GyHgG0cKYPY/6toEn+8pAgcpEmpAfG\r\nfVrGgWOX8+DxdDZJCoCndhVgH8fUHwKQ7++3tS852SEcLH/YyaJFioDgxrsk\r\nXNpqJPsaBzAp3yfANPBrk29OVcKzuMAk8U2y8kJaV4FxelGCCkt+5qVxfxzs\r\nCIE11b5T0GKhhwGXHqYNn0W0m0iKq835m7GaWbNCoUuWqYw9kOq6L6aGAljJ\r\n91zBi323kp+pLanpZgrIfxltKz+F4NHZ1chI4wXXB821PhMU3vgofgt3w9A0\r\nW26CWSB54bqb/YXg0r0KNTvfUd6aEivsvf7qpBD2+5wbAsBhKLmvnZg/QJhj\r\n1kos2pAA7TmjN6qZk6eoS2dFuJr059AjSwk=\r\n=Akqf\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"07a077fe623c177c8d35acc24d474e8a93151511","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.90_1648686110858_0.40472959984512236","host":"s3://npm-registry-packages"}},"2.46.91":{"name":"@apollosproject/ui-onboarding","version":"2.46.91","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.91","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5ec46f1279f977f4fe52d4280b29cf498050dc4b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.91.tgz","fileCount":87,"integrity":"sha512-S42l1m6rUdmwHvq1LTlkYw3tIKdSyx1ugoRX2dYPV0x9FbHvkjWVWLYTvjhm/wxWB0vP9dIG61TpITDEoOI/Ng==","signatures":[{"sig":"MEYCIQDuZmttbboBWi2+oVPJPk+TrttJWf696soX2P356u5yywIhALTaa42gcRvjB5mWD98+ro6ouZyTrX1n0m66ZcOhXvAi","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":943557,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPUGACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqduQ//bsbqEgjFgy1yX7BrRwRh5eFjn4EHWC7l4d4N17UTmGlOp6QB\r\n3x1hIUbsZ2lRIiQa+oSBJbCa2LQQx5xN4z1nsLTZS4K4U3d197K6/KrWEc9v\r\n+aUoOLT4F22ue0P3V/mLAZSWW+XOs9A0t6pPSBz0t0Vyuuq1LsdSP51oZwHF\r\nj5Ss+TXUP0efdXraD70I6T+vShB/YIrDehIsnH6PMswb+DmOiIotR2RBp6HY\r\nTzNkwPfglETxQu0j/+I7zr3/uVXWMbU57TGYeFz4coaR+hf8sa/7gMTq/08u\r\n2spoGpVHY9qHCvZ5k06k/jgwCau1hgZ0kGIXCLx2Ms7HH3DOylX7rXM4TDxV\r\nBHAzXf8TKsN26NErXEED+GQMfBOm1LlOmuVmaHjXULFvLOft3FquAm6fmaK+\r\niCTl73IRMtArx3N0VRU7EO7gTtS07HKWP31Gspb44P7SKyELj6G/bj6fswi4\r\n1vgFHb4hZXTD6bKeD34Kd0LzKxRuy6iA5U3TCYe5XjNw4vg9pZLxfCFmn4YV\r\nsMjZdka39gBI94eklYPJvIUip+X9cK/WD9u7/f9YujPaWhgxbc/MtzlW0eQB\r\nKgCtLPwoQSjkeoCtxQUGUpTzFpEdldo6LKx9Em6kcVjXoojmc030psNsCqpA\r\n7j0cehLK46Wcj67F/KENv2gDjGn5roJLb+c=\r\n=iOF9\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"0928ce5b1ac8465bf7cc1f71bebc014d19d3c254","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.91_1648686342629_0.7146820343321512","host":"s3://npm-registry-packages"}},"2.46.92":{"name":"@apollosproject/ui-onboarding","version":"2.46.92","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.92","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"565ace1a4fe91ff24fb1fcc99ecba0573458fc81","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.92.tgz","fileCount":87,"integrity":"sha512-w1DUso+SsoLc+woe+PLZ3DyiH37H0tB697Gws1NKGHsm1k4Elpu3FQ3CVIJZuCNyunSb1f28awrDZ7XpjsRWOg==","signatures":[{"sig":"MEYCIQDHpMcPlYnAGvIBFEdE+DaFnzyWrC47HpFi/V9EZ8LUSAIhAN8u3i05jUw7PJLX98mZhR6KBDTFp2WMo6SiC5jARmwr","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":943736,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPXsACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpJrg//YDlZIoiUyIigOm0seMupv5HUCSnMwvV0hmvF59kzdXthXDLq\r\n1fPrGZFyTwKaDy5V+jsSeWz80Y+yHeT5WwW0/N7WXoaKEbT+OkALKldt4/fn\r\nky1UKEtXWVM3Pf3yb7HHCy2w2Co6b97S8F6iybsj9clZD2hCiLnLdmuzG3IP\r\nkUjetEbGV7GrZZaVzWG4QsBvT+sT4W6BgL/X01jJPxP+hKEQgfPPJr10hpFr\r\nlJ8jGUTJL+9HPZPPRZkTpOjHP2Ut2MsvMy68CH7raA45hsdCUCSKiOeBKbMU\r\ntpUMDbVmu6XsH95b4oh5XESISE67oDE/dH2oklVIsxMydbd4n3UA7wWQfefH\r\nYb9cVXNBJycTQVNrr6jZzREjtDv7Y0dCHfsjIjiK1/0q6KOnkKaKjqBgADME\r\npFLgc2lotDbzcx1iZoEF4mqT+myKJfro2pi3/xrwbcE+te3cLSRkiy3e9Pc9\r\ndTZ1RhhoQRIcC7fZ498S97EDKrXFvZn6cLhso89PfzTX2oIANPenJujqxjd8\r\ntNx4DJbkY31C1V+pRZIDyYzj7IiaOj56p4I051LuII7ybcnhdX6A/qWsmwtO\r\nBBQXIB3W+vdVOkOowJU4klCSI4AD0H8ZRwaaaDjS2qnQL7B2jOr8Lc5ATTG5\r\n4W6F4IdzvrszcQaTXXeokJThNeU2Lv97dNg=\r\n=1HFf\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"fb3a956fce5dd8758e92604c6624dcf4ee479a17","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.92_1648686572355_0.3639293027927424","host":"s3://npm-registry-packages"}},"2.46.93":{"name":"@apollosproject/ui-onboarding","version":"2.46.93","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.93","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5a244dee6bbf55df46fc348050d7c2c55ee8507d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.93.tgz","fileCount":87,"integrity":"sha512-JzzjKqzog8eUDZtNOrK2IFWiXY7rFwTCMUZpqjhAZwL5soCzukHuQj9FOJ8Zm3NC1nFtoBBbAJfc+Z5EPajZ9w==","signatures":[{"sig":"MEUCIDBJ1OHAuW/4xBXW5YdDflpqWlrJvUsNljKT5ZZGmAkGAiEAl33O+wvT+O8i05JuEi3++AvE+xKeBSaxCy7cNQx9Th0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":943915,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPahACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqg3g/+M9YaBtwBzpAcyM3Y+XpYOowNqTi986fXIhy0Bt56IDBgbFtC\r\nCMgEmyNDJEbcJkmpFxsESyyw14D4IVAwRVkuzKpNGaoBrA/A6tSOJlxP2h8u\r\nUUQ+3uO2qXEBMknMjIbrznlyYXyjgkWc5s0VMWQ2QLYFTmn8Pm8ju+3kh1Vr\r\n6KmH9N9iPpC+FZOP2vIKQ14dXHDcUe7o9F6P4NIIK3CFOwmbE7ySFeu6f9Uf\r\n21Gly6LodTqR4XAZ2AseHMRXx89+1m0Xp4er93U65GL88b4/DGhCWC1RBI5y\r\n/8x3Duf7/KLF0Ia0ig34qOXOrQNn215n8ptoGzg3nd9xwJXQbrKW4+heDtVx\r\ng4aylPltDtJXMIf0zZmKA9pjT5Jkq8NDk5k+LBPTCZTqjUIJBYWX+0A8HQyN\r\n6+hQDPxw+WJF2FetyaWp62W/n9Iwwlw9whBcl2o3nlBIf/zHLN8Nt6th/T7y\r\nWfYEkJxXWT8nskMb1MD8FyYNNntxPM2YH3ou45NRGFJW734ApbqvnRwhTvO4\r\nDGdpbHfqNjkYpKV1mIgpL+W2f8CWD1n9hMz8vnH1pCuoBMY3rp8kPd6mg/3j\r\nuyBC5lzut/90HkbRlMWflmj6klfzIBFgG6u+uKZhCjG6R+A0tL8Ae6TB6fT/\r\nTte+9kfG/CTBJFDLM7zWqHL3LFgJuN4AGdw=\r\n=aXEk\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c48ee270638718bde3879a17e12423290b57c051","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.93_1648686753014_0.1467244695149592","host":"s3://npm-registry-packages"}},"2.46.94":{"name":"@apollosproject/ui-onboarding","version":"2.46.94","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.94","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"88303500ca4a89bb20a677dc639e5b2b1516fc1f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.94.tgz","fileCount":87,"integrity":"sha512-/7/CO0fjfklr2jfcdKqyhg+jmt9PdekBoM89WVaq1YsHlonOlvfG3QZZkgMNZ8QMefOlo5vzle02jrubcyci7w==","signatures":[{"sig":"MEUCIQCN9yGDd2VYawy2CjxtTbEvkhob1B9J8K+QjGfjH++4ewIgFSQpFj9ATgv4Ee3j8YQRvnd9O3qb0FoPciV5I8BYLLQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":944094,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPd3ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo/6g/+LUYZ0oHeKYFOi8Mpcf7XOzV9JsV89ANCFKNM2H9MARbhraCU\r\nR8CH2bEWCuSIts6O/dxeKn7jAmxkrpOtyyTGUHZkdwRPpsxoGTBC8ysQt+N6\r\ndRJs7n4Y3SVIV5UrDSm7GazIbKhmJOqdye3HFa+sJVbGActJUaHAzn2YhNSt\r\nU3PDLhW6KJ2yrhXmaT2arPqasbvqx7FWfhBshbYwfFaEUJAHFljmoglafhc2\r\nl5dnPgI3EYxJ8HrP3SrxCDVwGok90T8SBOTlLpQPBVtjuqwDtvsGWOBWQqaa\r\n64AhzT06lVmoMInHtsix3wh7sEoT34MSDCJ6d7L7S3rTk8U3alNwsBYLNpST\r\n9b60qscT2FSVY/f/2HQLfZ7vCiNM8cmtrPclmQvA6zNhS96SME9GCl+xXRIy\r\nYp84irQc06QA9EJPnjcgR3bVswBayXObFcuYsXRk+frHWf+wv/+vPrXOKjqS\r\nWDVGJYrZTyqkZIukhvzJwodXnah1JHHm2LAQpEeUG4R43qXOWakunIiWXoA0\r\nKktsjCvxOe8KgMiHkJehWTwJPHQVEgPsxYJQofDEpXoO7ZKOwEAyPQ/Gsjex\r\nkqr5nhGKuFtilfgjmJsMxOdHUZTDWYsZk54SbTrRK37t1iUo8Os1Oxz4XYnN\r\nqOPfJZ7nDprIwvNGPqh7Njbw0jsu5dR5wHc=\r\n=lUZ9\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c13aa8f2ef1f353bf7c1e9a2606078ff04b029af","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.94_1648686967424_0.7843987846513056","host":"s3://npm-registry-packages"}},"2.46.95":{"name":"@apollosproject/ui-onboarding","version":"2.46.95","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.95","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2d202b7d8b4f38d1ea71360dffff87d3e293c431","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.95.tgz","fileCount":87,"integrity":"sha512-Pfa2D/1HyWSSUmvFkRp7oRQWVT15BgcKuDqB+22fwDZuadrWKXGRBW7V3k3zmU7D6oiJi/fJXswlzN9CB6A4tQ==","signatures":[{"sig":"MEQCICsaI98cmObmn1FmUQbvBdY0tAgcBQqo2cC1LXFwz1hOAiAGdHF71zWytX7XL5YxMDA9HCdqSlqZzdrmILm9bRkM4g==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":944273,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPhaACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmojpw//XM2NpiqUz97vF2J56OsitHB7XMnwvTJBIq0IBlULpmkdpKqF\r\n5RGoSItvtMk/D90leThpMJSgHd0vcma4nVWVGFHX/PV/sh2yNPZCq9S5zrs6\r\nmZ86jllrNSwhX2AHVFCLXCyEAkV905pid3ILknoHKlYqMO126ObGtf28SbB4\r\n504dVEYkl9+GWyCXBse8j3MO4lqRoZHpKmkhJ3TpIVUJmMClkxZ1a1sbHpyu\r\n0Oh2SpGGVDZueFy2jFfjU1Ocxkip69iZklb0XZd6CHyy/QCZnFBkIUTOQ2ik\r\nGmXHMDsZcHx7/q5BGC10OGPIjN8vH96Lu/sBO4/w+ItMkjxH0h7l5byt/nE4\r\nXfEbdxZKFlA01qrN4UO9/HJf+gIdaKK0CNeInO8+pqYqXZ1u4bxHefllDVkj\r\nuv76BY1yQNGwzYsRrQq1e3Bbc+zprc99uYIdjF+R51yzJqbvv8TaNk39RZDm\r\n6gAyw66+YElgigj6VmsZa/pbOy5FxQ1WViTE3tW5Ko0gXJt05S5yw/Op73QJ\r\n28usCeNYSY3kS5zSLVMSzl4moJi8fTaZ5eKYy5xNRBFu/evIOOlPZkSERp/l\r\nyKLYcP7NjcRbr7NcEvgMl5TyAIYg9FRHABVrZJrtxmY/yblVpVoOGFnJvr+h\r\nPdeSzVgK/Go3hb2jo2Aqvy0cYqEz++f+bw4=\r\n=V4Xz\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"a1bc4acc210ea73f166fde940402ee4ec8d2c024","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.95_1648687194462_0.04954852829663703","host":"s3://npm-registry-packages"}},"2.46.96":{"name":"@apollosproject/ui-onboarding","version":"2.46.96","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.96","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6a535821888c7744f6f1f1a2053a1ba537988968","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.96.tgz","fileCount":87,"integrity":"sha512-Qrh/dwmLxVt6nYByFRRDWc/6zw6vHI9x6JchXccm7EPhuoCGjooagRh3DNp3t165pzuBg2oQwfGrXFrG//AtGA==","signatures":[{"sig":"MEYCIQCb2W6Xvadt/GrQJzPRIO/tdxyAET/1CvnS5VmsAELtBgIhAP98OO8cCB/ylMSgol/0HvLdyYVxHCJZhHUkvTMjaUGU","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":944452,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPkMACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqXnQ//SWhbJ+MuKJR5khjGQAminriL4la1mI7dhSOtLPRvkDyNsgpj\r\nS6EPAYqqOxLsVBnVm7Nwk4/FPnGbDoFIotrUlh7//rgH0RiDGI3Tci8L8pjU\r\nRpeenWMY4YAlIfVu5HeSbvXB+rSea9lTmwWCq3Y9URgc/72wTJNF/C8E7j0I\r\nldYGo0DQyHHTYk1W1bTSldZmnZr1MuDKI6YqECX7w+WzGuE4b/fWZqEmxAF/\r\nV9smq8fTQo5/fRbfeojWevBaf05R6BYq21p2GwHF/h4BvgJiQhKkpsCd7oM5\r\nv1kSfM09NVgSVOt5nwTaHpsn1hQ7JafYfYjRy8ID72DBkrhlh7VFd7fLS+60\r\n1C72V4+B6o6bCEzOpGn+eWgpi2uZ/E4E445nIL6VmKSYdyXr5qPLqPYDGiNm\r\nxpjLK5T3eChGA267nBexc0wLXNmCmBuWxFCLv4NbyIRr9ELCRCDl6j7490rE\r\nX+WiC+VybCkHeSOEsCMAOER0HyQgqwh+ETlrYcaABdsoxuErDelJFPlzVRno\r\nPPJ19ruqlJY0ZI3b8lHbX1zjUCd94r+Be+p5T+6lwtde0jEAgtSlBMdhx5Jx\r\nRu++9K/STHLp9VYTsQ2skasclZ/1ol+OJpyHb8R0s2QSVCUDy4K+INGHgpc/\r\n8mpc5/DF5Y25TahgbOMWNcH06P96YrwyMtU=\r\n=Deyk\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"151d38327fb3f8722fddbb5721cf138bed92c371","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.96_1648687372000_0.8983333842135905","host":"s3://npm-registry-packages"}},"2.46.97":{"name":"@apollosproject/ui-onboarding","version":"2.46.97","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.97","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"0f9eb86b6531130ff95f41a94f867a0fe4992005","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.97.tgz","fileCount":87,"integrity":"sha512-x/sgBvOxm62sk7qgovjIk6Pz1VcowiAmOlnWKxrNpiw3JHGUP/J4DNiekXBCOkVcZSwxxnr6Bloz9GTBdZQfvw==","signatures":[{"sig":"MEYCIQDbsY1DUje4nxZdbZDqsyHRIcxb1I2zKNFI2Tz3PGT+gQIhANW2Udm+neryYfS0/z4emf9CYCKRsyo9GDzPgBuAKJMC","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":944631,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPoAACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo17A//XnYh9BT8CuM9IZ//9CtQyH9avXhnBxVT30yD1AS3isvpX8vi\r\nlaoR5DtE2pQsBZP1oKoRtBcgmFavbXz1Z8mzXKlnCUQ3HVaaL8sr3OibDYtW\r\nZMTs9aAhvO8Oq3cmlyS9d1JRNreYsf5FHRIVZFN8wJpowbblSHkRNHwPkVaw\r\n1BrLhgGgVD/wToqWGj6HZkgfkrDre3YHwKF5fR9FOT716TcDqPZmY7Y+9nR9\r\ngG+tQlTP6QgYU5eipEGME9JDN6xXksrtKief0YOnlKiUqEBLLQ1MuLXxinQ3\r\n39NuQ1l4QZIR+z00mvszLfMWLJM2apNzLfPaiPqjZEcFaDaDc0RSOQaTHyk/\r\n1ZQhewe2FqoZ0GuxQNV2dR4R+p48cSPbIR/RYpG8UHOs61a6FR1oCU8sIeNO\r\ndAoug9Q5oO/0VS9PXJ7zyD1JuCDee9iPlsU6BcRhtvNxUiNzlWboy8WaHzFI\r\nVahFbIBkClKyc0U8b+vKnVgP/GfDDSlpRs/UDINd5G0mvEhKIP2OKbHGp5Lb\r\nef9FiBxpngjhbd75hOn2oCslKG9KNZm+RCiP22yxccSzpTBoMCjuWcPNqf9p\r\n0fG0anhFomGFi8i5HkET+PwVLIfCw5Ey4HOSf8psAYUYiFzNrUMm0LZi+VPd\r\nPaGctCYllgEP95tkPmQBPzlKd9ylNSS9cCk=\r\n=P+Wl\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"7c5a4e80eade4699de2b8ff825a036b6ca623d15","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.97_1648687616161_0.37903708708278927","host":"s3://npm-registry-packages"}},"2.46.98":{"name":"@apollosproject/ui-onboarding","version":"2.46.98","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.98","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"767c95f1ccbe6a433796305f05881d68be24030a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.98.tgz","fileCount":87,"integrity":"sha512-1qnclYuq/KeNjhot5mY7Y/NtPfFyX7JcEmmNc7Lc4OJAbDtK5AQEbWNCEXXtV3QkbLT5div+e/aTAVHDCZAU1Q==","signatures":[{"sig":"MEUCIQD8mHo0O2WJRwxazDDeSXNe/xbVCUYXDg9/mIqDyLSoxwIgGsr28WMZAqrAaJLrDNF8jwd0C8OTxLbTzQRd+8hElNk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":944810,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPq+ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmriQA/+NxTeCMsvzAcLeSpf63jcXrNjiBCYNsVkuqjQz4RHm4WId/a/\r\nvwgitTEMVMMvOzF2ZsPya4xKBuNfBdcQnYPWuv4ulfQemw+5XeDtTyt9fifq\r\neS0uTH4VEQMxkcGfH7g3gedyiTfiGlp3OOCZLWfjC5ggtMe9I+TOrtC6T5QA\r\nX1HQ/PbzmpG5o1wnV7ChRsAeD495dRYP6AMcBI2pnvLeOU1EChOSMJlGQKVO\r\n8OxRRxizXkEouPnxXlkdiv57eIjXCC0rX4+e1fJd/0c2BQk8nRVlEgwXdv6o\r\nQOXNB3y96fubqTaYyj33ZvVTUlqyeIiw4n59xNX0eMPcQxrgEov+IF24bVDy\r\nmjCDW5QuShBfX3BsGOJGtc8PUhgOo8o2K9WjrB8MLXtllHCNgFCxEEyg/yWN\r\nVfxZwZRRx6VDuw5KwHUJOINxHTcQ5FFBmYaa32xK0NpajvGhr0GqRjzDoTFp\r\nDEWjjrhe0BEfM2UqrPkKClGc95U9Vf+5gwlNNzgAJYWIz5P9QvoCiD7sFCXJ\r\nxiADI2oswKngbcGVZnNK7oBKwzU4j/7N+HWQYS1G8Q0RaabOHhi8LimLnQai\r\n2frl1W31gq6IVriLP23zOwAqC5qodIuw83Km2hUn6ExS3SV0Vn0nxbtX9TRV\r\nh26XrVfY1+ES0XSm2Euwek5eq7KPXPEfdBY=\r\n=DR7L\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"783a8f71598196f826cf37891256c514923eb998","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.98_1648687806371_0.6897426880178363","host":"s3://npm-registry-packages"}},"2.46.99":{"name":"@apollosproject/ui-onboarding","version":"2.46.99","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.99","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"80028f15b52f31bf9b9fb57e3f065463e587964d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.99.tgz","fileCount":87,"integrity":"sha512-me/4bLLY+jJBVwmaSnIqjSuiX0LTp/frRl6ogg6woVTpnf4ju7CNou+0RO/lwLywYaS8ir3tc/77++5GohPcLw==","signatures":[{"sig":"MEUCID5kxTp7zj2qWzoi9w4T1iZtX19bzO16mMlZdTnoZP/8AiEAmtKYZWnCbnAhhK4gfBJq5u/gHEz3gcpVM5zwycAt07w=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":944989,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPt5ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrqzxAAglpfkhUcaniPMsZKl1YQdkiJKxoQpC+yxGZPPJKC3ayLpunW\r\nxcRbaB7yRQ9+FP/SPrKNE2X3rAvXW0LMLen8/YX/NX+EUZtXR6oMvVxyr4By\r\n8mRsgPlVQVUWmOgCnj9wDZHwoPiZGYlrUy3SUnqOfUR/2OT6bXQQ8RbmM/yg\r\nO/4ne10+h9r6jRpLwkKwOv1App2UekIGPJCbq7gdDrXGajTYSIUjFI5OFWmk\r\nPJ1qztIBz+Vm9uiqrCNimLd3gsRQCWmACjOgOxRzia3BUYdf0oSnFBEOtQWS\r\nYnIa9tszNJYq4jjDjRjEcjin9s0DzXs07GjyjzRitWVIahZt3Z6UniQnK9hp\r\nJu/F8LHSc6lFldzd5I50CstqB6epeBf7/P1u+n6flWpqj8DlHnWrS+KKO4+r\r\neonv/5S1s+ZDDMQ3+SbjhcFiWL4cKhRX74GvSM8lKnXLFXBsEdpDQQ5eKhmX\r\n9qrTSq0+XxFfUw5Gy06rOfQxPR0u9Tc2ncAYDvqvvbQA8aPcydrVss8hHmBF\r\nCQq4AXuZs9HMjxOkpgswfnYQlYr8v4JuDjTtQ4z308+5ySxY3k04jR5NQEB3\r\nhdjNuD3SjdbzGXYOhZRmRKuG0WbO/T/m5GGxf7/mPT6AavCacH0fUPqAW7sp\r\nJ6eJQq+PA1XWNRShy5EFDjGzBtpB8NjrnSs=\r\n=izIU\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c1abf33052521aef21299884edb2051be9f1bb90","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.99_1648687993170_0.4002447909763134","host":"s3://npm-registry-packages"}},"2.46.100":{"name":"@apollosproject/ui-onboarding","version":"2.46.100","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.100","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a15717c27f1a8a0c2dbc4dd78d91e8323c617196","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.100.tgz","fileCount":87,"integrity":"sha512-RhtSqO8jTsJtgw6xfJLlgzvEcA4Ay8Zc8EOW9bwJoQSmr3msK+VO4MteLhh4mlSgn0dBH+JZsDnwprmC1SHUkw==","signatures":[{"sig":"MEYCIQCNZg743sp54Hz/RHWGsFZuY3HH7Io59UMDRmv78C2QhgIhAJqdOBem0avXP55lCKluFGPIdWYuzyj/aTCkllQjnX6E","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":945171,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPwhACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoecA/9H2jC0L9VkDqxZjLAG15mJ1CdS7kBAocDICs04ijRocSpwlnQ\r\n+XNXeb2aN3DdrljTo2M0UX5hojreN0LrtqUeWqZMLy0Elxi1dqNEoOe88wBW\r\nQKl0nXxGLKnnM8bemztsYgIvM9VKbhPVPx6uVMX/CX9UIt0EAKlotaR/GxA7\r\nE1H+y6Bb0sZ729VhqGmJ9/va3cymSyv1Uw/ag4+7LdzfAjyHDrNGlIleOAAg\r\nMcLYOmDz1gyubiYTuJT3YbwfCoVPQpft+s18CzoX23m6BivxZHfGIGn3ud0B\r\nE6B3Yzab89IMHyMNpn6Wuom6msr1+JG3/uAHN1TPg35uvICNw94ZaoHfQl9N\r\niJzdXJy8IzjNEmQ9ryHmK3vgirKN39kBeItSp4FgC7egq1tHk7M/euu0f4kV\r\nj2ry4+RjDHkXbqb+9JE2nkJ5eIaD7VDbKXpjDyQWBb9j8Mac5Rh6jnZJIUwS\r\nDnvcP+b6JQ2fALSbI+dhEaVPxybuX04reOYCk1nz1UNJkxE1SzN29DwwM1pf\r\n9Zdu5oqhE8sEdwar+ZZGXNNqJEv4V4B96mhcO3pUoW2P/e7EZYaj95msDovz\r\nBf191gMRnguUd3y5aIh+5ogHbSJozbvuZo+ZDJJqulWIiuJP6MOeypuUEGf7\r\nlFAQotBTbs0eIDorbazXKj+QPvRt11nmkJ0=\r\n=Zr74\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c2e500b4f70d564425077febef10754e3b1d92e6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.100_1648688161180_0.4688456486935677","host":"s3://npm-registry-packages"}},"2.46.101":{"name":"@apollosproject/ui-onboarding","version":"2.46.101","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.101","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"74eb91a0d7e856e6161858d8ad07ac3e2f2fd66f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.101.tgz","fileCount":87,"integrity":"sha512-ViyHj9pZWcyYKz4CsoGz1c5io2MM+FjTESoy33XlOqrVkPSBsc+30rH7aQD6+CEiUUwJ28QcxG5htbuagIRtcg==","signatures":[{"sig":"MEYCIQDmVJr0oITRUesTECozBgKws5acocsWrYbWznKdzIe+cgIhAMMpZGfzU7Ylm4rpd6yWRRWGnV0M6C2VfUMybODHtg14","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":945353,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRPzwACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrAWQ//bAfgNZllbHkDUUGqDABjOERdjGuuZLK4hoYILHT6VYQPflu0\r\nZVK11lK7IzmxhVLPj8SQg0+gP3LItzxuCyMmUwayxALSzRKRH/tlEBJTfRNz\r\n1kDRubTctbzsydNL7FiSen0N9btns9l+SqlJ6iGhSUX/tGIRPmNWT61xZLA2\r\nd2LYNJYJlyvWO6xeXgl6zXjHaneQ33PW9NRiemgUlbTf87dreaSwYQOSsCjJ\r\n/Zd9ZW+qVTYiDjamLrmgL7/R3xP5oS1mN7LpRAfIq1lzZNOiLs4zOafw4969\r\nd/xJy6oWgwPhmMM0agTisGrlhGjkeppKYSaeRUiETOjEwTkRLxgVUSRshv50\r\n9T4x1e6LD/toL2eJJacImbA40xh/ChKyUmnfiJBHt3GC3hunoH+IOXfjdaG+\r\nPriw6M6c4gKhgn4KCc80Njh2VPda7vLaLv2Gu0DkAZNWMaOHeYm6kNCddXix\r\n6O71kjWxNuE70KFz3qZzALBlOcknv+HrYx16c9PuRWMw8nIp1O2z2zXMf5wi\r\nLyioSDjmSPeL5x8ONAtQ3lResj6hoUaopQKChgkfE75ik4oXSOEkWZvNsi8m\r\nMbwm6uvNElgbOW62qu5d8z3mbMb7IQB59glvqJAV2weD/pVoudTsf9Lk7T9E\r\ngzjKpy5N8mNT/7hEdSNNmOgt+bEHORp1Lsc=\r\n=/QqX\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"a5c3fe53e3ec061bd8d812c51d3ac831a6dc89f2","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.101_1648688368540_0.302015844174258","host":"s3://npm-registry-packages"}},"2.46.102":{"name":"@apollosproject/ui-onboarding","version":"2.46.102","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.102","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c52ee24b6d813b81a6082b73b73c77e29f24b0da","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.102.tgz","fileCount":87,"integrity":"sha512-0XuHBqDgP35NN4KeOTwuQh1FJyDE2MtPrNP0k3i6w+gDJ4hbk6PUuCPw3m6XjamfxVVNbiToZsaMoVMX99cI4w==","signatures":[{"sig":"MEUCIQDxeTSsIZa+SgKWnHR83OOJsXsGb/aNub8nb1/rSX+j2wIgbLJLShM86Ee0udCWZU8YMn80+edCRV7YYPvk6iJWwCI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":945535,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRP3QACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoISA//ToZxpZDlxhq1ngstj5VwmweKXMYTnoJX2l8JGcdLFIhnQAkP\r\n/7Wxe2E77/TyFp4BTKW/5Q5tXH7VKoVKftpRosPn2kB12KGkX30oQEEH9zdW\r\nN/I9rYb5ergtU5P4BgowH+K+Axb3cbnTeFMGbY+Pq3Hlh4R6CE6UdQHwkYRW\r\n7s5WpCH2v2jcxxtMcNWR4/HB4ScDZU+VLx/CeBp+UXPy1qDyL4WYQZHRaGxp\r\nxVqcKfe4AJE5icOR3P68RnYWwb+3NF0/eLZkGCRb1r3ySGbjR8xUAopZqZ6c\r\nk0SfW+JIlIrFc8dOxyaV2dgqw4T2qP1eSRBG/ntjSEpUe5AnCiq6xicvvRHm\r\nONq+iwsW29295kcLjcafekYWVFqFkW4fSxtxvmmhrL5p/OY2jKIPbcZdqREC\r\n300hppqNzD+T1myRBAbqDohIjm+NgM6uacKnKT2Chz26KfMdxYtvxtnwELM8\r\nwvtE2bilzZxD7BiIv+3AZIGNztCqoIXZYKa8uimknV2GH4myFGsEGQ72NlD7\r\nzYNBndKiFW/bA0Mmn8ismOA0VEDGnl1+4M7ejh3c4oHX1oOqgK/8tod8tXEL\r\nUGMTnXngc4AUrWJ1tyMptw2j/PebtQbCMC8J98KwkrbgpG487RweANniiVn6\r\nIKW5wUgR/shmCjbYjvraA6QyPlDLuQEZxYQ=\r\n=If3C\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c617d908069d063ba38367e10688a9a4923c5d12","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.102_1648688591839_0.09038536593986701","host":"s3://npm-registry-packages"}},"2.46.103":{"name":"@apollosproject/ui-onboarding","version":"2.46.103","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.103","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2bffcbd4c74766efdec7a7cddcfb4fad26d680d2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.103.tgz","fileCount":87,"integrity":"sha512-rbDpHxAMa1eGLevFFfZX7XoxGNntQt0JeW8AcpL0apCar3HBfY9XXyqW/J9kgII4VwvutlwcbUzVMeup47uSTA==","signatures":[{"sig":"MEYCIQDIBVZO02tt2Ym1orx9Vcvwc69P66x7SZCiAiPdQW+2DAIhAKUCsNLq9ENjtW9K8HsYAUE+jegovnqLW1SWEXTHvuJV","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":945717,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRP6BACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp8tw//Svca91UJvldk3YFFCbHbvCt5qoUnnzGtwiGIKzS1S55GNaF9\r\nUHH27SxWTZnkGv6/EtqKrmQPnVCcRcIrTOG7ZemzOHgd5JF396yaoOSQM1ia\r\nfBDgNMSw0KIGrUO4kjJM1D8l3JBL5hHjJghelCKzHUWHrjt31OtQqgIKk+86\r\no/+pw6Iz1zBwGWgSyhJwIHC7zH7mss3O93xTSKgExbFkRKyhVuzXSVSGDXz2\r\nI51xO4kmudh1RI+weLyHnB3vzbycCQD+4AEMmfYkKBnDyu1Y6QYepfedcdty\r\nvvieopl8jLgN9+KTCSQEFBE3eacisj5EBCd9zOWvt41I44JI+djGS2+kNulM\r\n10KfUsG1Q5WPqevqmn+Axe/nwGf499AHrBzoGoMspfbI+wFxAe9BJNz/CWYo\r\nVlqwGjF4gdCAntAKXTvueMOdJpxpBQbtKeRHzpti6vCaH4ncZiw/o2TT8eDc\r\na7Yof2zCxTVGQAIVW6oAhPwprRhZxOohG/+xrMPDjx5uEo4fWgjVA8ZGOUHO\r\nun3Nnu6nhh5wTSiJ3mp3NXoACTWwpa0wPR4gASjuxIy/unKbyfOVak7xw2t/\r\nVhxZWrSDfgMhxaC2hfLvIJ+VJSrWbSuelhM6WpJYWtLt/loyR6ccmeOFs7OS\r\n5jTcpCSRasQw17oKhTQMruw9GkcH8gxMre4=\r\n=hQXX\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"56d0e57e574d027a8446b1e783db535338121197","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.103_1648688768822_0.19199340703479462","host":"s3://npm-registry-packages"}},"2.46.104":{"name":"@apollosproject/ui-onboarding","version":"2.46.104","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.104","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"e94a296edfde38b186cdb3366cfad888a3b116f8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.104.tgz","fileCount":87,"integrity":"sha512-bFYetxACZWUHcHIBbFBld/h+zwZeZadmGQZ5yZk7PQqo/8+W+4CkNd+aWZ+dRuQcK+yVBeKfZvHejlVE1b81qw==","signatures":[{"sig":"MEUCIG+CpjGSFmqMuCFLuPgeu1VsFzGbEk7JhsLpRuzHpwMMAiEAiClDsxDB+nKLFMgY90jEtRJXLTbxWqysClyLgHbJdWk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":945899,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRP9cACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo9bQ/8CrTElyrRXd72xgBVFez3uRfuYeVwH95YY+0CZRntx8X8+x6H\r\nOaWUryfOD7i80pf/PEoXlIzb/uXVcD7fflrCYvS44MMF3v0K0DCWZg+0IwXe\r\nBRelErf7fR2EF+7qswY9i0uTZE9ek9s9LAVD2jbj85IS1CuakB/oidH/wuP2\r\n8KcGMBNJvu8ye0GU0bOivDIovlAUgN1aqdM5gPsV7ZW8k59ki6vnjXwsaibt\r\n3hGEfCQIb76VhSOIruQxp9dNf4zy4t9FQV0UtBE9E8knYSaIOgnQVAE79nsD\r\nOq5ISKMfR+hpyaaj6w/zWRD2SDUBZE0kHgMpnXeU5JhFea5RFxfEacZ2AHtU\r\nrBXd9trygv04+s/+rtzNMLYIFOpgZo91Yd8mhV4hUMDQuk1rQ/Ihsodwcs4Z\r\nmCodsXVQx54pHRXHupOL74VEoAv+xUAbKN0K3d9s32D+/1R8KZJZ6KU+z1gp\r\n+f4MwAjuibRzdHlEaK0V9tHW1thDzTj5dBpU7BQhOhrgXGpBAeoLvHDtoX2E\r\nIsgg3DnHYBKSoaOc9iUhOdhAzB/xXZQWtXUafmGC5eP6DlgFKRT+4VYrpOqy\r\nXWDCdhWqzCKFGHe1Nxaqs9LUFVkzC3Xex3vLpE4Kp6prh7AyjFbVzAFjM1fM\r\ntCrY79fKPA0AyK0+c4Z+4vFDQ+TkUa5gEJU=\r\n=vNju\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"127746c89f0da806ef5337b43496e09c882e5cb9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.104_1648688987846_0.7960997540823096","host":"s3://npm-registry-packages"}},"2.46.105":{"name":"@apollosproject/ui-onboarding","version":"2.46.105","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.105","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4ccc28646aeb53957d2e05f4acd3edbc5bce1e4c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.105.tgz","fileCount":87,"integrity":"sha512-dZ1R+zNNSFJcy2BAphD3n8MtNf2mGUJgqucQ4byDbAVXSUpv3N/O2Ex+EOplnVh66X4GEu3U175JEtGXBmmgNA==","signatures":[{"sig":"MEYCIQCUCbTpVdw0ZI+sxh1JwV/1Y6NcAI+49KcouWM26idF7QIhAJKP1ww0Bcj5gATSSMX9vFBgB/yVpwg41DFE/azwTZ0u","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":946081,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQAkACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpgRhAAnQeFthFUeDrscrngPKrhidj0U55XIje5YjUCwwI6rsLSHWiN\r\n5fN8RA20kc4E/noC3Eta9jPfjwpwXLWMd9wGjtuPuuP69UafoMaI2sNon2TA\r\nQ0pDLkxCA4SCi0bLWJFHXQm3R5pzYGLvDFtNZaCmwP/2Bw8+gh7B6ypeseku\r\nVTPnxrONDStK9nH7zm7j4q4UPYUz++4g8OKFYejMElVSdyCkk75hYJ8cUuCi\r\nWSuUfuQs4msvNP1jb5pl1VZ/mEdBAkDXhuLROADOyHDpDGNk0QYldcT+Q3Ya\r\nkLAbrY78AoNvCquCGkJi+wDx6dbc2v5IoGzvsnp74WA4Nh/iwu8GOL6uWKwi\r\nCRfq2bJNaN21DV8NPXy/Hy1bHophW6c9O3EbwdiyZARrsTC5HS/tPyf581IY\r\nIiCaRdm5xhyEN3EXpogVoO/8ZQZVRhL0ye8VL0GVG+3D/ZmARy2/SCWCScff\r\n0KsW0IgWFfDhOn3kajkoWLv5g2Yv6p9U0e94cpzOuseLJL2oEH7eo2C3gGgj\r\npOcXzNH+gyELrifOvLF6rRX07iUr5E8EtTLtpw5kdDrUFLF8HdIFLsr2pPDp\r\np9HM5gnlMxZ5Aih8Bnv5HkTeNIo+87eYFP9X8fnEHkeCZZzxxrBAo6YCMrPD\r\n5Li79bcuP2oJ8FMikxSYVhopfGSgLeYaq7I=\r\n=Rbmt\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"725483cc961f97bd88da5304cdcb3c6bb6fe5802","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.105_1648689188550_0.3764730482230332","host":"s3://npm-registry-packages"}},"2.46.106":{"name":"@apollosproject/ui-onboarding","version":"2.46.106","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.106","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"21ddabe958980b06c0da37c27d19febddc320af4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.106.tgz","fileCount":87,"integrity":"sha512-yhByahA+j0AvcThHyhJvTxy3+8saIFNxVBxVMhweS+/xgV5AifMUVycf9TJY/hvSFzjJCtJIWmCvPgAwv3xpIg==","signatures":[{"sig":"MEUCIQCnc9pGmIMyUOe5WODhwDYLM5UPRlK4Ebi34sOXRBXnGAIgAqPUu/7o0e0hh05GJa8HCF/Z6vsusV+dX90sGhFSv6A=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":946263,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQD6ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmomHQ//dtnp628uUSlndpukSUJmQCq3RFPoWOSBCqj9s0niDo2edKbW\r\nzs2pWC7YXl4A3aMUqekU75d2NBhW+lWGRVaVC19T8rwzJp6vMQX9KzZDIXMJ\r\nK3huWEoIy/EqCRAckfV8aQwrXvpKp0o7ovhAXbmDcPMY0fYqAi+d80ZnQ4zm\r\nTmbdRBWyUDpEne/Jz2LtWjZZzmc7m4inQN2nFiYaidXZrIPsf0A4K+UAqedJ\r\nOlZ58/y2JnPICErZfOaCMFWvgaVVl8TN+/u8qxRLuO8CtzkQHV21M9LyPZes\r\nPFhJf65D8uFS0T+lcGe0GL47nHSKfdeNb4lcb1bA+rZZ2s5IPLSrS2jQ57Ax\r\nyTCM8fhFG/IQWl5CmGGr1XsmD7sFExiR87HLyUERDTOy1LSIjq5UbykzVPCr\r\ncIhi2AAx4barYCSwEQ1UnHyaG64EU4jNimb/itbg1fBRo0Mu9PhNsjwW6v0R\r\n5MX4z8X7QKKVOxsAJyD+YoYam4/BaKWr5ZptR/gghvUr1MKjuQtEiJrnNB4w\r\nRUOByiazSOclQax3OppaA8HPz7tMiObOtDReqK/WBknZMGDmKAnUcPbvuqvS\r\n5DgexX5TEE8C9TIJP/Pa/+oCBa9z4y93oVaXwWcYYeuKL+S5QxnvZLNHyuo6\r\nmDa3vTXGY4hcVaR8wABwKE7BKbt9Opthe7I=\r\n=lV0B\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ff681a492e28ca04557e77e88ef18281bcfc6b68","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.106_1648689402756_0.14662047222731367","host":"s3://npm-registry-packages"}},"2.46.107":{"name":"@apollosproject/ui-onboarding","version":"2.46.107","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.107","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6c41e88254e00967835513e934be7adf47669eb6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.107.tgz","fileCount":87,"integrity":"sha512-CGbSp2s7V8uLGgf9R1f7Le4OG3YjwqiNi92G23k97s73+Kb7euXBmkgg2EaxgeJVHg2QlycWbUhQdp5gTG5bvQ==","signatures":[{"sig":"MEYCIQCJzzUXEyhvjJ4QUQS9jbEqsb1VgdvB+q4djNRPMAUSwQIhAKOdUttvsjO5ko7qXm9A+KYkyr8bTzJWd6i2Drr8uwZr","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":946445,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQHFACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpSTw/+NLGcWwYzW3vFo/ARfVtGyYpB7Na8UQ7D+UqdL+6NKi/xDj5A\r\n40lgnKGo1QKfVkDgFrPke0KsowTmPgpf6jCu6s38SJCrQFy2TmegJ7JiI7Na\r\n0Y2QNECAlsEl9H0VZIgLy8uET7nG/XeN3ejEL1SaV3rCw1mx0oxyFruwjY/D\r\nn54SUwgqzB/Pf/xQCkzfyIu7yOFFsktAA39p+WgunUzk40VZbLrrbRL3cVBx\r\n7S2rIytUDjbKchfRg+3UYnGO86LGR+uHMJmWQZoFh+XDHz6DXP7SGUTNFFp8\r\n8xZJTh3mq6txIjESERD9LGhsTQOfHH7ijU74aRVPVqQ9KsYbDP/5NzQ5TjQ7\r\n6UDZHOGjtDAUcow3aRGOZqm24Ey6t3oiB3AgwF4eST9St1+pBjYAaokYTLtJ\r\n9vcqCum7cwxk6rDtEbXnDyzNs7k2BNmOXFTKz5x8jLrIXPvkBJrYcPQPf8zY\r\nmVk34x4ik/H/5mDzjZ+kCqJJQujJYc+Yzr9SsRbaieQTLUAHF0X1rbGYhpc6\r\nny2Qm9JbQdMfOyexGbdQd+cKIy9OB0D8cpDXvjovvETyKGdXQULAhEAHkof8\r\n3S3/cIUJNKRhKDgHcPPnSZn4uqLyqq9+I7kke35jhMh4whsD7GChqNusJ9ZO\r\n4mTQr46Q2JjYlrH27y/iUGMX7QwDRMhvguM=\r\n=KgpJ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"a083c6c8b8b42a057b722bbbdf420f487fbae85d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.107_1648689605399_0.8830165706888029","host":"s3://npm-registry-packages"}},"2.46.108":{"name":"@apollosproject/ui-onboarding","version":"2.46.108","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.108","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"dfce8e108868a9c3e86311d1e6a3cc63777a76de","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.108.tgz","fileCount":87,"integrity":"sha512-N+ZbWEfozqKRrsFjY8fHJqVi9MaJhdiMoNBcDa/Ca42qtdbdO1DaInSgJE/SK8tb+9uq1g5naI8faqeLtbXBRw==","signatures":[{"sig":"MEUCIGL2+XBk8+lh7twbegxzYlRywj0wyDIat65f7K2VApxEAiEA/92WztG9j4AKWdb04GZ6aFSmnTgR6B1hWZl9M4jVFlo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":946627,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQJ4ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoSXRAAl3yC/4FdwE2zwwZjxTuUsymaCA2l9bpRJK55/n6CeXq37ADT\r\nFVu5v6go6dXss8CzNknxFAQSpYtV/VRljWJH51g5qzB2NC3bCKXf9bG+3CPG\r\nSPp0v2MDdjeW6ltoXgR9GcLUC4T/5e71GiVVKUvHs5ESeM5NOHBKYeh9ECBc\r\n+vbz9EOX0AX/SH2EWpRWS7oVmUz1YGCWYsPnRjV++mWPmFbM8mYK5LV4jaIF\r\nSjEMD7EEB8t+hjEVEwvCm9/S1lWkrj7kOjFCgPst6ccRhSRfYFx5zpi9MlIv\r\nGS9LQFuzXLRTLYkvzjtRqCut7EiNDUklUj+gFtDVjGGSurgeut48c/0WgOhF\r\nSKTCgOyglKfpKsgFHblmvMBrPT0zQ8jfMfx5FZkucl4VLnBDjqPHeBRKO8kw\r\nKPCHu/94TBqbwep6p7fprdZijPZ4xCh00KWtqiXKQwV81YaMF+ov/akuRgC9\r\nTkuBqGxHBo+dQRsl8KO8hBK0bEapwjSUU0+teEoNqX5TI9RPzRPQDV5knk1N\r\nVWfSknUvkLgMggl/wOHkTqsBHWoHk2/SWDjMMxvzKieODcaznBjN/HKzc+lK\r\n7bbER2UexagDAXbcssdVtAHg+hHLveiSJ8Pl9xruFF8w9X3Jz1YFBwA3Q/a4\r\nNcxtt40QSD7i2lSXE2sztIAU0dTlZ8WbboA=\r\n=689i\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"3fee7a66e777ddc0497f9e0ce651872969ec60a4","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.108_1648689784578_0.40136709989835895","host":"s3://npm-registry-packages"}},"2.46.109":{"name":"@apollosproject/ui-onboarding","version":"2.46.109","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.109","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2cf7273331e907addfb6caf6dfe1ef837a15e948","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.109.tgz","fileCount":87,"integrity":"sha512-ALQyIdiRf6DsA4lB3f2vqRSGIP3kmJyq61BkAjWpwBLI9VNZlRFkfCgB+RW7NGmVIFc/DrcEa1uZ2JvBdf3Czg==","signatures":[{"sig":"MEQCIGvhDb+7V5Yx8Q7FBnqxEBcWkaXJUjewnapVcaPfNrk9AiAzE+ugYRyjq++zvlx9fM6NI3UGJpjQ5wLQEaO2rimBtg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":946809,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQM9ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmri6A//eSOiqaa9xS+3OWR1dQBtvdU0KwVfud78KMr4Iawdc+bPzLfo\r\n92HwFnRiBKJEnkg4QTo/40/omrxKbzW64/hJduIw+r2kbinSh3JxkgsxrE13\r\negdk6Ltg+CoM0w7UnTcgFBOb9QTV2jLTvcysV4AQVGjJeLF5sc2EbCkLy3p5\r\nybVeM1VgtHHfr8v8MRFJB/+trMmOgzH8IX192WFKzvhATCMJ/Bdwmb/DS1la\r\n44Ai4mUlBguOdqYAH9K/dqKZoRzh02cA6hNV/1QfSihZ+Wc9HzoMsO1aWDPr\r\nVgjWR6BJEqnMKP79UbOKG6qsuOlv3eH/P0UzvOEKBlwvQkffRz1si7EDdtF6\r\n54irEW/ww/HJh6330x4DP8vwhdfRkgeNL8NRjF5Lo05Qui8pRFDh9jgwUNou\r\nGq5XbqOrLI00a3nqpSMAh3lrdArM91uG7PPO93p9Nbyb/aLgt0BgdzZgNbxa\r\nIWd+VWv2ydY8JtDo1HPkLkxWgAjTwUIBpUITJb1jrcRjUnT241kX/VQZUN5v\r\nx7RSqTdBjITvYggiAV8SEM1m0g/F/pHW0l7js/jkq+b3oX8TYHEX3NXs5ybr\r\nFXaYiTRp4fn6WeD/5S6B6YqkRs8cIzlqf/JZQAr6Kj8ZvL4tPynqWD8QlD0E\r\nuCI/EyejRVgVl0j4OicHVEL6WOqmdleSptw=\r\n=ego0\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c7b98ca1b30d6105d8ea394a36403089e94d3fa3","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.109_1648689981058_0.8158858276519656","host":"s3://npm-registry-packages"}},"2.46.110":{"name":"@apollosproject/ui-onboarding","version":"2.46.110","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.110","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"144388a5043f95c82212b3d4cc294bdd63534dc6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.110.tgz","fileCount":87,"integrity":"sha512-rm0iCQ9SHiMeLTUkT/WdJqZ0M2zvxT/zwF0ykLcBEZFrVdOL2oraV9m0awCdwVVVSMiyedHSAQchsrdDSsg2VQ==","signatures":[{"sig":"MEQCIACM7rPUaO0VCAnSQVOFVKzK07/XLB1+iISjsLUkfhb9AiAMj8ig1+6p+rTNTebLMgaf59uwSg6ChbmEZhGrwyqO7w==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":946991,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQP8ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmofvBAAnTO+f2jAWZPqmgLJme0zWN44D1znFoswVBKXxfMZB5BV4Rs1\r\n1f/beIx7W82F2aLsxkiafAxfs5H0Cvt2SCDYS74PbbeG2I6oWN6tllAUsgbL\r\nwUK93iCVUnvyoO78RzqhA0JuMDzg9Q7CtDV0/2JsVkQjf+Sda1CDhdKekSoj\r\nKeefFIpnZtCU2l45GuX0PB6h0hBU9/gn7DlrYoMxfck+vhaSqIlNnJjHcnnF\r\np57ntax/ulz5fSzLFaC45FFIj4E+S8o/VM3vPcHgcazEaJDH4Sa+QcxYu/at\r\nrj+8Cb0Nzfb4a3YWMryjo+IcTv5qw08VNX8Q6HB8KVwT3IfrY/S2wsMDl9uC\r\n8z8LoIKixlHd0cze3QQQdPq+NdEGQ/FNeRrLVbW0sQ1Bmqu8KPXQG542GokH\r\nmJYC8lrJJ5cEy+XSPPoUl1zemtnrkK9Tucr0HGbQ6jN3lU+NKwYJJ+zpZBgb\r\nKkw2Epaq0R3cxZjwcIE6pv8swb4TDEsAm46EaUo319kPbWmFsQcr+SaN+bER\r\nzqCLkxc33ypV+pOQ4W6lGGVXdeJRAhFZkPmK5JunTK2nH1JT6l6z8OnMCfsU\r\nzpDgLctPeMdsz7+s9lP/tshXIBVumnXns3ZTgnBwUc8HLHFJBN9GtFEvnj1f\r\n+PNQKPx0zjgJR4JWBr7QqdRfiEGVJ5x2cr0=\r\n=BT0b\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"56a3be402b4b26ec1deb29ba99d7392719b2a6cc","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.110_1648690172537_0.44381569628584505","host":"s3://npm-registry-packages"}},"2.46.111":{"name":"@apollosproject/ui-onboarding","version":"2.46.111","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.111","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6c04fa9c2f8b363a2a721774f18c74e12e1d14f5","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.111.tgz","fileCount":87,"integrity":"sha512-qAOieA4jIqrBHxYU49zt9XdRrO8xrplrMkjtJqGaXW5a7tT4lu9WNVVubjkBlZZAf5/bdGmsjTEOOnZf4Aq4Hg==","signatures":[{"sig":"MEUCICvG7KNbkUrQwKXZZgsgSUck6hOABDLe48GN+u6gCxPbAiEAhTJRlrN2ynjjnZ4s+R34CcS4wyPHw2pVaxKUwgA75rY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":947173,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQStACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqElA//VNoAwZVKBUGbAq0AdoGQA7LkOx1RpDQD06tPwpKGI+IIGOsS\r\neMdmmu/xqjWTjeW/DGqxpDlJ0IDIzr0I8VZGi1xsItFKFeHbU4lXaxm6Xq4N\r\nusHwfDqJsGpnxq+UzTTwVlHS3GTlUi7eZAzMoqyAYZwiEx1KMvCKdF8W2do4\r\niNiYh692hHKb/1fBtXeUoZplISoW+rYYkPJVTparJJcoD3Jqixn65M3uakix\r\nrRNgKn/glXh5QCo1HMOIGsTced09sQSyzY1l8MNJXQlTpm3FgIFihcIl/0qH\r\ncaWMpLk5oiUSL2jc9wq5FmfS7mFJI78/ih9XzXrrNs79IyRijOj7bDXdrToo\r\nB93GoRHqQ7exWoGTr1zAsfgJZcOlakMiFm4bpXPQ82N1urV6jNjBT8ng/eCr\r\nTnjkQkPOFF9Zc13NwR7okBLwlk8WVbYiojT+1qRYkQwni+qmCr2haV5xbjMK\r\nvbgF5TIb8s4+HpyzEziAVhHfeIQFfG8pfe/6k6BRDOgUu5/o2RVGg/VnEOue\r\npMry9vBjhTnitQwPtOp+mD4qeLg/iOzfGepwY2hf47OjEsFlXsMRNK+Sa5/F\r\nfJr8OYAXejsPS9rKt+jU1mQVY01az9J0E33+l25wwUmIQ7odZg3LOTFQRuSg\r\nix3qKoX4/gLpe0jo3By888noazr+3tH+B5c=\r\n=2TZw\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"8566f39c943929f508c0ddc0820a0ec611662312","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.111_1648690349522_0.20182658208349746","host":"s3://npm-registry-packages"}},"2.46.112":{"name":"@apollosproject/ui-onboarding","version":"2.46.112","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.112","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"138a19987ba6df5e4099797c21e9be46506337b8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.112.tgz","fileCount":87,"integrity":"sha512-ddUlky2NMkP5cxuWHFlLEiAUMNIGBPYHzIJ9kLmQH9X52vwT6RoXgeKOJFB0AhVlhEv3gVNG8opfKbUToA3yVA==","signatures":[{"sig":"MEQCIHYYWxOEV5LEzokMG2ZqfIoEhWZ24kf4oKu4Ns8VZFiRAiAqD+5ZF3rcAIRZUfMvtCGoDfJYiuTNx7kHjyEr8fIYTQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":947355,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQWRACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp9fBAAlDomKVWrzrTbTC80LKnNCL4GnXzGgAY+MH5HkSEcMnYm4Yfq\r\nvkxCMSx51bS+AHjdrxwwcJUznx+tJk/O2w8pDm0Ppp6t+iX+awDYKbA/8ld+\r\n8QF7tGeKuLRg2Ytx1v1xnupLqVZPSBP8knFFolEkslRR8fa+dEOceErFzU9J\r\nQfNUvsn5060xh6NJefK3qzl6YLRL8gPQSAWsYKm8wuIMbExrIexDCJW+algr\r\n5eTCbZ6x2DoaIWhG1X9hR3onIIR5lgxZktopdqarEr5vg9bSG3IOc4lS8u+V\r\nN+I4VMkxJQm6eH3NYw2VN/AL7SPGHYIPtnFNqHXpYjuesAJDytYE3u4MBa/h\r\n1/tMMQ3cNixRvz0g5gxP+8Nt3SWF2EvtXRnpzuGNNsmASdWOlZeVrmVrgyO/\r\nvMroGZSXDpqdfp3V2UXvuEfAzli0LrAi2dwGTkx3y6yW7gxLOXlRwEdS2NpZ\r\nB4oS81EJ/y4eFdpsY4g6JG3zN640l4isThdeuXb2gSLjxiywG8n9kIm2JnGa\r\nCY6EPW5GQGdQIcfYCawiZzB6w0uRSckq/49elNBpmhDbheFJz3qN0a9MgcQa\r\njB2calmF+MxELSxmiQQuZ7j8jnrXE6juJ7ngsxK0/JBuPa0lQAfiKeIlJfQq\r\n3ciI/Wcu7azZHCSb754VAV8+vWc0cz0Xfec=\r\n=Tsg3\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"37e16e4d639ed40fc26b589a6116391116cc227a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.112_1648690577008_0.4251954743484847","host":"s3://npm-registry-packages"}},"2.46.113":{"name":"@apollosproject/ui-onboarding","version":"2.46.113","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.113","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"40815dd5c5686b92debda59c9a4c1aa87e88e4b0","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.113.tgz","fileCount":87,"integrity":"sha512-D84U+CN7km2nuJZyDtjeOq110Rx7uE+CEzkGUFMtfi5L/BIoLp0lSfc4B/+loiS6FEZwjqd1AXoWLHcA8TAK2Q==","signatures":[{"sig":"MEQCIBEiEbTls9x52jN5Td3EuhID0TDPtmCkq4e4PNAyqAA8AiAU8uq32VnPxFludJPDASgmQB539bsEzXIlmM5or55Jyw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":947537,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQZcACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmojxQ/8CEr/6HVCbuuTib2OpUy29J3goQK6RiHpwmSB4q6Yl4VDWBP3\r\nh3YtvoQaEIL0nk1EHRQ3HewqlVpIJRpexbiM0/rU4UFFNBSQf9QNHIBXFub9\r\nS2QknILCnEMQl+SSBenv5bvWcWeeZTULJqL4UXvY6A3F29amzm6D7SeVRlKh\r\ngUlMMnQavQYLKIdNpnbCmi7UL9qktr0xVsGae6Ws7mr7QAECQG0oOtdh4maU\r\nccwDk5qzugr4OrPnDvSHVA3GzZI9TYU2mi7dRscCshXNG7AINqaPutGJDft7\r\n+RQzfNdf7IrRNOBIxXEcxfG1hPLlNzfvk4d098YCz+59ZiVz1E74w3Rj5ira\r\n1m0cKnVV/UlU/x1X/HHbtNTwnGIZgzLIehMa8Xb7YAqIU1EgnsrRbfMCl3NL\r\n/W2a9E6WwzypGRYtmr671GsEupKynuxf0VqOvI2u4Rdgfa0FnVQ2k1x6SE+l\r\nH3pQ1Q27aRRDk5fJznmLzGR12VthZRsyR/Co0+kOJLax8B76tKW+W82Bv6Mx\r\noS0RH/H2yetQp7xmhcTYR3ARRyPPIXsHrCvjwE/DCPdWFbYeKaPint5hWnmS\r\nDCN+oLPFqxzWyIcVZRyBx4lVgbLh55GH1FZcaZzXgf9vOZHAgFK+EOW57alA\r\niT+WUjje9wlkOlu38E0Ibozi00lEFEpqMlE=\r\n=5hCy\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"835aa1905fb50ed13adeb263be574728c1ae004f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.113_1648690780527_0.05304027783546528","host":"s3://npm-registry-packages"}},"2.46.114":{"name":"@apollosproject/ui-onboarding","version":"2.46.114","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.114","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"cda84bc0816e92569d32b95156376e82853d7598","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.114.tgz","fileCount":87,"integrity":"sha512-Eq24Xax0FPLTGIH9JyqyYh3XgtwmPHYAhh3eDVq3pouPUbsldz2t0pON9zz6Rz77+7/ZjRaeCKE0tUWvS7v9pg==","signatures":[{"sig":"MEUCIQDEDzThWjJElfPsfAC0MKDNq8aU+u7eTpdTDviUxs+v2wIgfDA8FBmlJgHPio4ztyD/i5iYBR6wgvbtTItiaHClxqw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":947719,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQb1ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqPJg//QFbwIV2cjRMbYWoPdrF3vUdDFKeE2U473lE5EgcS+5s3C9OL\r\nkiQnrF3PwF5iK2ux/ZHt4XnK1dIZ4g8Tp6L2K44nDa7vsOfCJ+sqzMDW64nk\r\nT5jGLIVKPkxiSnKIBa4QUpxVYFG8citH7obGvb1kP7ArLnwfd9L8fWpn6bnU\r\npXmfmfzrYbUkq5RjdoWcTZcUkJNup/zcyftjNcC7GBYVX7VvlbU0oJ9wWZ86\r\nIumtupS09aFODEblkgZyutgdq7b8b4dFmJjSzmGzZIf4cMN42sqijjzsBPAw\r\nHVhQsdOeN15RG7+YiT4HCdAciXt+cnP9LjaAEblgSYuIyI6VKyHIRy+OnngY\r\nLmlA4v5/86FgGYki/S73ropuZtLrAM9GRJw2w29rXESj0e6m0NLQ5hep+Sq8\r\njjVve0w8/wL5QnlwonxvIDg0NmOehr9ITveZJS6tr4wevr2eHvscw4UNM/X8\r\n6YJ0CbxPI0h8dnqGNCGlCQ24KBkCrqnoLEJkwImebFpcLi+M/wF/b/euiJfh\r\n97ip6KTPsgJo7F1JmE8BuHolsYhDRmnsOzQG9IUqsMACFIADfY5dpUdAgkcG\r\n+/yqT4FhHSuv4sHjItAMhqEsH7gtscCY8pukXE0vXJsMpT413QCwe4sta0Wz\r\nE0AOgwpRr+fIIG79PkK4WkTfOoB8H4lhLIA=\r\n=zCZ2\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"6779956ccc56a7aee839bc11468ed4532fa05628","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.114_1648690933755_0.6361580289908852","host":"s3://npm-registry-packages"}},"2.46.115":{"name":"@apollosproject/ui-onboarding","version":"2.46.115","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.115","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"625892b1b293b970995b7ac42e3aa2f26c4b806f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.115.tgz","fileCount":87,"integrity":"sha512-VAWQSalw4r8pqzhdRYnK1EnYZp+XMJJgbYSKPtSsNVaTSh2m8NtDN3F14+/sa2nQIWw+qf/K7ad/BJqtuYdL6Q==","signatures":[{"sig":"MEQCIG7rd+Gz2WCpHZIl8dhLoLqzCjQZw66QR8zNk1HqvAUZAiBT8qYurXAmACxbFw1rQ5DRIEZkt7maRmbLjunE+mRaBQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":947901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQfZACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoSTA//YU5IsLhdurVx1C8N0Iio02OaRgLKn8tAHRyKPKPLEUvijAcj\r\nhobMsf1gEH0svM9LppIjY5FCaseNOufY2mCDpPfblhXvbK5e8DmbyfViYQ8N\r\nld7iVKdx8Wnrujza7mDwWRYMpS8Ulq6bIqqVWYiWE24ExMcQ9Uiu9BspV8IN\r\ndEdkdkT2LmLcLo1Dalat8zBj55hLZJS17vVGT/ERr7ux1YmwW7e3pX3mXfZA\r\nnWUTfeuXRdx9pGyt89icYI2WY0vKj/P+6eSqOlioKIaAf9y313MFDoJXAxsD\r\nNshK20Qcd1QFwH6MiR30NVEpUh7aLrHIlWgu1xRXlD4YSiT0gDz5Sykj+TJv\r\nd0SQzM2njpt+zesxXpNOVReWCmtt4esZ/1/nMXaOx+J5ge//qnxx1sjbHewu\r\nupHrqfiu1J2OcYqcxgm3oCaUU3+spFpk25RhH0b/dD+qJEeZV0wIVmkcAFY6\r\nxFQ9TrRjhMDddQse60Y8BCGCbRimKg2gw+Mng/ZU1ldN5OGMHmu5XUVr4T5J\r\nIy6lJhEow/2hrgvHVmj+Xh8iZGUb2IAf24zo6ji4REfc/vfWqW5rVD1o1cDr\r\nZ7gHUGVmm0HjJl3iNO3d/GKH5n6kOj+Nk1uUrzB+YT2YDZyvGUxx6slzPtro\r\nHe83XMkO/1cOc74rjDA2vpn5Yv3lbDqdd8Q=\r\n=Pwk4\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"8f57a64938aef605d5369fb64e698e4c1b09a97c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.115_1648691161249_0.15335582396118475","host":"s3://npm-registry-packages"}},"2.46.116":{"name":"@apollosproject/ui-onboarding","version":"2.46.116","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.116","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b23a753ba97c8684a1c3f1b13e4749b4f2ab49ab","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.116.tgz","fileCount":87,"integrity":"sha512-squ7GRV86xn3AMRlcQedkKykQho9BE+jQLXNhsYjSSvQsVEIvDRNH141vCn16U7C4M76A1c9ofWoSKRLwLKExA==","signatures":[{"sig":"MEUCIQCLLSXVr+05QgXSHVd2qOzPvgyMFj9TtX8ABWpX9z1GkgIgPHD9hyH/MWPebwISln4O/xSyXjRJpNCTWixGFn6MrNM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":948083,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQiwACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrteRAAix8sO4drEjtjiE4vqA6acphMf5axjozFF9kgiuGaWh85opi9\r\nq3yXBiJEmylzxv6uEcfXd4HhjIsbnsnHjramHD9TPE6z6OYZRc0JMWF05JBS\r\nJ74kfuvc5KvzxtCIADeWJRr9LvSm4N4INaXZsLg0XwFzQEONSGbVCQ1vIc7V\r\nscol4sxCLEwPNbpofx5mRH38eyquR9dWR4pSg6Mkc2z5AJh8xb1a6PUoGCrD\r\nejc3fZMByaz/kdkTF08hRZYyPrgpxJLR7XMPM/c1UDfeFaPB60YdamAX28bV\r\naeyCwY8KvRIZkhPRcJ+UkV46eOQX68tOtz+IWnnpYqYqLXRxC4I9Uumz6Nkm\r\nrcGlDNEC4ccsDY5NsHucSSF1u8PYaD1cyd3yz6ltdWX5qbUbVf8zUUPgWJLR\r\nbdJwJsq3vW7uwJUH2u9V6Uohp7rb8Fm3baPYZANr5P9g4/9XRX6y6WCyp9hu\r\nJQsi57FemnS94gL1/baKpkiJ/GP5k7rX/vEjpITQ/y+hJu31yroh3YNeYnky\r\nuu8JraIHkNmMjT1akfSraJryPkP+E4bFv4wNEIY0/JU5wz3Yw9i31VBL/6m4\r\nrrmULNdpHA+sV6+ftiLh80iPcA1MWGz5muCM6a8AloyzRb9tVjcVGDdfTh3F\r\nn4OMlAWtXHkvGo0VaUMF8b6aO4D9GHqbq+E=\r\n=irtK\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"5c350ac88b59b1b0ca8f5e04e667e227411fc929","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.116_1648691375886_0.9500051357889974","host":"s3://npm-registry-packages"}},"2.46.117":{"name":"@apollosproject/ui-onboarding","version":"2.46.117","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.117","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"bce717025116e18bff42bd350ee2cffb0d6f550e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.117.tgz","fileCount":87,"integrity":"sha512-Gp5fZBKaOh0ahq3SOf7ppM7dQ9hJIVbS+4QYWQvLdUjXeHYukmvVZka2qn/ZJNYdxIDivI5MMU5JXn8RQu07VQ==","signatures":[{"sig":"MEUCIESCsV3mMSH6VrDtekw0MsdHmtdqhteT3n4UQXOj2XWlAiEAj/vdG3lGiesdbYC3RWm4ISEv0Losfm710q9tQ00VTTQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":948265,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQmdACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmrbqg/+MZNH+Mm5njWX5zMjy4ta+43KIoOImoZJEyAzHH6H+++/IglU\r\nbm+frbD9oiL8LG4iLm1fjV89qgNXhyYCFg5SzBUWCdwFrptFgkK0c3lmNZ8d\r\nPuDtzmWI2TvKT2LSGeQwMu/s0F83G/XfYeMMCpUNYNbkNXo+AqHMuPCtnSWx\r\nBVgiTgRPEuY6dXKOTkEfTwMNV2RvAfoqZODSR3BLyVpHDrILRsXjvVdINzaY\r\nFXm0tj/MckOuLQ+MJlWxSaoG7Bl6AVoklPhYZfu3Eqxs7EwT9bFkrGKSGSZo\r\n8zxHPs2hNnY2ls7GsiPe2ro3ruvzzAoIdY3kmHJR0207x4/BqdvsAVLBLhxJ\r\n2rm5TogT/UZTjCD9W9xUBsAB+G4EWci8MEzxw8s9b0Gi1LUgKRApEXpoyOpO\r\nCirmHuTbIR8tKv/MWqU6HYJO1t4Vf6qHiH0eX6qzQWvPQ7owRsVHUMwtxBE7\r\nSX9MFDp2Rcwj51CtxU+VJNkLTYsjokW/7TcQbAqQDntdtyF8cgIm68ts0ujW\r\nlZOFwG+OhmAWbBhRYUsdwOkR0R5fm05E+f+NFwZpe73nKMbvYrpZZWqIU7J4\r\n0SA0JQOVim3BtEF25eWxTL5gSpN6B/bOEhGkUaKEMiyNR+poZGXWZObmM23t\r\nboaAuAc4wmV/SSbQiSP2w6tu8L0A/CnB3Tg=\r\n=AFSV\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"f428b79ff9fd9eaa60211839d8b703ea360cad86","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.117_1648691613427_0.9432512836174225","host":"s3://npm-registry-packages"}},"2.46.118":{"name":"@apollosproject/ui-onboarding","version":"2.46.118","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.118","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"016d0fa8fe67803cf481563b8d2df25fa21cbb20","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.118.tgz","fileCount":87,"integrity":"sha512-TybgX/7I+fsSXCoJ50cC87yxoCzorWajGFoHuiqY+xyZoMVYTd2nmfWRnlOWnsqAn2AdiHephW6gmvgdWoRlDA==","signatures":[{"sig":"MEQCIBwRwbzGTUdC3zBYYNpgsD+53UkQPXyU7vp1rGrkKzARAiAuW9a6khNImBQ1o5gxzRcoqpYXMqADnCVhgCAD4TqYiQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":948447,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQpbACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmogWw/+Kd57gflNbyDfesZ9RUSKxRxCNCn8d+TYvb5zDa1fIE6j7Qom\r\ndYxLPBksoC5B2BICrQP1fhNLn3d4Zx1xtb/zDg3vhRsI5ltytXL4LBnMWioc\r\n6uS7/8Y49Y3B1MK0S9dBHIb4+QD8qq/Fx51JT/os0RAPAs6Psp4+jK/aKGKV\r\n0oS2VyOkZSHsvLT8f23GNpC7UW2VUEeHuMvu9MXzzqZDsmTQZzcCKI6FO7f2\r\niBdzlrN3KHTufbKLdWE6u4GmbOqm36jIA/kjyozf8pWoLZSErdb9qqYrLWI5\r\n81Er6fNffa0dLB+KUWeHvQsgQittqgQNh85zNvJFGjtDS1XeJmzA5ddiOS1a\r\ncmtZxnjTNuch7mCOqjblBgwA8jxYZ9UUrKj8y8LFWn3E13x3zuOlr7FS6lSa\r\nirMG4tEkNeEokOMFS/puKAu3jouNdhCVSVdYoaNxYxi+WRWzaVMGldLBJqnq\r\nfBJDirXvCiJJu7rvYq24kjQKlDgF60V2hOSOFEf3Ki4VFV0jb9lyB+4omgNe\r\nG+bx2yQ5oJr9mkD2a+nLJ5ZWG/vAsUuU69bJwCvNwG09W9GmRkRq/uFx0e+D\r\nXudNJwltmcPVsuDXABi0QhTWOKluIygWz4k9bKnxrDoRk9bCDmczwG0O76Td\r\nC35hQW42o+Fp5EMJ4LfZMr9PKCBMpHiq77k=\r\n=QQMy\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"6514e11138e54c5a64c8f20b6d13b36bee6aefd9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.118_1648691803724_0.8219822605184515","host":"s3://npm-registry-packages"}},"2.46.119":{"name":"@apollosproject/ui-onboarding","version":"2.46.119","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.119","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"29b915b6d59a0d5685790293fe14eb4e004c27f1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.119.tgz","fileCount":87,"integrity":"sha512-A336Mf7J7aA+y0cqeGAmBerHaTV1MAdmCP4xDwl5KOaleVXLxdckl23RHd6btmqzZZc99POoFsOMKo0wbIWgNA==","signatures":[{"sig":"MEYCIQCy2b6hOaiwzPF1Pkxqn0SrmYmsFl/ZYQsWP1e4eOtAlgIhAPl0cQ+5uj7mC85Dyji4gb0H2JRzLWEqtcUieq7RZFPW","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":948629,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQsRACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoyhQ//ag3W3+yIVmOklsw/+QkMJmkuTuzdbpkWDI8Xr3FtOZ+9IPnp\r\nnCG1Wo6S3nis+eq/jMbu6GAZ79tgZeu1vN+R+7I/Re6XtHSfnIv1qXdRSItv\r\n8qMKpbY/c8tDuHS2E7KRp0CE7fWI/tjjeS0VohCeLvPrjcmjf8kKAEk1pMhX\r\nvGquwJJJvA5ioqXYVJlZWtxivEub2/eKz731i4uei4hoaDDTZTrD2rT9texh\r\nP0T1FJLcCpWjEJU284iRHzqWWBoxN2+kgeIgaBg02ElqT3WSEqrEAriX9Uca\r\nICh6m8a795Yie1WeYOoOdTv8+LbS+omkAsYDpfbHGAWVZLc2mwQm9F5eC84B\r\niTshcUNdCP09PUHifkOxkiAmJ/p4Xn6n9UfqzeUQzwgAgIl22vt5JXu0l8RU\r\nktZX7SOMY8MvY+0PD96480oXOkjkVI/9J6L0EqJfJxJ6X4MtTpSfy9UZn0rV\r\n+YcL1sZz4RlpFRX3dOSEiWQbZgl6w2Z7Z5LzuHyOceckiG19HKZYZHdgcj06\r\nYh8cwnNgu2MdH/mEZbTLJmmM+mdM8wZaa0iypzm5FIieomoJwilLakSsmDzg\r\nV0RfYqq6gPrVJ4RdpfnN7UB+Pauz+BobY3rftry4sK04t5r4P5BEbFg8C1/j\r\niDcKep5w4Q+W74ndBxXfrMYj2F/iKfbmbQk=\r\n=e0gc\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"e8e0b762260bfab1dc67021f1d90244a68e2ef82","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.119_1648691985822_0.8447827889452186","host":"s3://npm-registry-packages"}},"2.46.120":{"name":"@apollosproject/ui-onboarding","version":"2.46.120","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.120","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"703ba6163ed2eae556aa310270bb9d9fc78c3b91","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.120.tgz","fileCount":87,"integrity":"sha512-JmbhhlutLGPI0ENv0zae2DDVyR43vm795d2mZbAdXL1wBYhb0L8izFH61tz8drkIamU3x1Vh3RWiFJEP83/JVQ==","signatures":[{"sig":"MEYCIQCbu7y/rmu2Uv0FSA5zFC2Y5C2q8fot69fy/HLQ5nii4AIhAN4Abo1kD6eRThcTvTrhPhFS0mDmWmaPxACd77otZYv4","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":948811,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQuzACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmot5g//ZYVWsrT4WzzH1dRx6Eo+80tZwSp9YUPJlxXoV63qBLfoH9kg\r\nDWIh4PePimIH3v+l7sxR+G5n11IYTc8WiMhBgL5snbCWe7rp3AAnrTCryFrE\r\nPGJs5hyufJQLI2pb3SxTDz4J9FUstFueP4jP2/3DcWhkG6UOBIiX7xE0VKMy\r\nt9wkw0EryR8LgDDumU0Tpm5Izh5m07/f6AYcFUZvzTKzIFkFl8XJheI15D6g\r\nETpwQnGBcvMiD6kaWPmYI3WCtcJjP3OwHeBS/LGcZdedD3ZKaUcrKVZInwAy\r\nlkoPbmNhhiH/kaYVPY9rXLPInjMHNmPtEv/3lX3T8mBE+1haxaFKtmbtSAtQ\r\n/bJhMe6Wq1IgOH6dQqGckUm3tLC1GLWpUWC0cJRROZBkbYftTfGLli/s4IrZ\r\n+uhHmRW4Hw7/P8eV0VX+8gHufsGxR1Jm13rEiFYpDJCAG/MlfGdBVBMzgDM9\r\n5f071bVaSRdQuSsHZmEuXk6UFWxZzCFdyMb4h41DSRyaZW1KbBdh0Y1u9XOG\r\njLZ4U83nmVw067Iohik8pqdfxgNwAV+qqYWDvqknp46smArMxENokNQ4kDoc\r\neFjFWaEBxzUfOOXi7mc9TZSNpGmGWHAT0sw0CXwo4yoU/dJ3M7tExN0h5oXQ\r\nmTSsX46uLTmf0943LHA2OMmWt5Twa160Cn8=\r\n=PMhb\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"24ae043c8126b300f712f71f40ead46b634aee50","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.120_1648692147220_0.12743064143711047","host":"s3://npm-registry-packages"}},"2.46.121":{"name":"@apollosproject/ui-onboarding","version":"2.46.121","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.121","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"cc61ea540913c21e6804b2fe6f51d333ceac11e6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.121.tgz","fileCount":87,"integrity":"sha512-ZqUBHbIM4ek9a7hIjyXQcqdK4FqirmPLMXiL1f3VxgLLbemLO+Bexzt9a7eWl10PxQ3isoTk5XivGZZxvJZLvg==","signatures":[{"sig":"MEUCIFc2w/1F282s8Qv6OyzUPBT+QytPI5tGuoweniT3N5gTAiEAtohaDJfosShsUiG5KfIfHYPhcSeDCV/iOrrVqqUH9+k=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":948993,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQxYACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrZKg//Xui97AqdE/C58dLJ+SOKioSD71gm6fNctKNnUdaVbAEncr1x\r\nulrIFUtIDzyPqf6nNr1Dh7cf7jQyXqLl5lxiWCgcn0LIyo+0OEWeMGoJXE3Y\r\n72RX8oule3B9mnwNrySShMzUhG00+Ms2Kcx6+PmujOz5ansNJ8bCTZrVzAOS\r\nwcNzQcNEWqUP/XXncpynBPgBx+L3MlWNLhK1fovn9pTkVAbQfnlL3A1OeDgr\r\nDLhzICcyViWU0oV9cLFEwVxK68AnP2wXnEYQCeYtb1xlXGfrAt4xoKKQ3NkD\r\nlzQP2WuoFnaP8jgPjPN/rDZK5g6XX3nCBLk5PZfb/gGXBJYaFAEf52KCaBea\r\n/3VXT3yNSlgqeUUfdr9qu0kd8t+ZZj4YwbMz4JC+cnTlcPSKZ9VYj9keaHz1\r\ng2nJgvHCqxL+J7tVa7psOFVqx+0foXKs+gts1Tr148E+5pznnIbQU90rU9Ma\r\n3f/hDmreAMPzRZh8fVsTu08+bZASzsJDvqaeEEKlUoWWKMdXGLfJTt8Z6RdH\r\naSXOCAg1Q2fd1ICXOT4cQUYItYq1dMHEYujidqaBWMp6tp63BYks+yLBITWu\r\n9WlnQFj0HGKqKlI9Ps9s21xLZ+e7HToHi+1YaNvVO4+zS10STxHdLK1C94zJ\r\n78+SD/MFlc21+ZZdsDr52XJorEQqJU3YSIk=\r\n=8HI0\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"157d311be52279e45f1683cbd96c68bdfb724de2","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.121_1648692312365_0.5734338012736102","host":"s3://npm-registry-packages"}},"2.46.122":{"name":"@apollosproject/ui-onboarding","version":"2.46.122","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.122","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"fa57a9089a5d3845b6c2402ec75ec171dd105e0d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.122.tgz","fileCount":87,"integrity":"sha512-klXaEa4rc+VpzRHdyVuFZOoEN52o455XCNKVaYwjFKs/ERed3gzMN4UMf8q3L9dgWBdYRW8gN2vzvj+7DbfaiQ==","signatures":[{"sig":"MEUCIQDwUucxAwS4OR6KRgo6411Lr67xTYYOJkPqWOs3qLaGbQIgDHOAIXFiv86hzOgFSlz8+s2aUIUIzC9er6opr785Qkc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":949175,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQz+ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmquWxAAh+/EY+pTuCWxRg6GhH5RL/LOr6eDY8sOITZGAtDRBI3lbPOq\r\njYRek/5Tk8GJfaiq3O5RLWJMpkcFu7kKW//koXUPjIH1mbzRqe5s9g0oZZEM\r\nTUAsZU10+diINSgwqxrhX3z/3MjQII4GvSfYekOrl4bnlLYi0XjGOicCEs/x\r\nHXwiMNN2l7o5QY/kBBiaQ7+Y+2Q3x4k+3Bq3JAxEqrc6vU0uX1Or1X0w95Il\r\n+JhSsur7vNnUjiH+LVg39fUo7S5Kco1+Jul6J3Nbn3taasegFplQANeywsQq\r\naJ1TUs2Oo5oQIzTfRBB7qK2e6gOfkPsoqx3I56z64XCeqERouBmb2dCNQztI\r\nlhazlFsBBORuouqsEkI4ADPzX1FmJ/d+4ZOHaNDbWQWq7pChc1MaiODl/ck2\r\n2SQosAR4u/saPpfwsVJOOEGM9F1+dXw3wnT7B+yS+BGP+1x8WBUghOpJ6Ouq\r\nmy7DJQT5B56nYlp3Idl/o6P15LJLHn1dof5rUNYrruRFSAO8hXi3F6V04CRg\r\n60FtKCpDkeHGGN9OuEMMRALXMagqtig/8Y3wRWI2ST4H5/QzfR+C/PeVZvbW\r\nzB1upqhUvg9tpL7Uh8HAIX1yxkrqliobqESYwtTuVnemDOGNK2k3zvntM15X\r\nA7SKEaI9ObGqxmQIDurlG89QC/aJRTa+Piw=\r\n=WyZm\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"b2f789c85072330715ac09d2bd9b64aa22776569","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.122_1648692478659_0.6813793658633673","host":"s3://npm-registry-packages"}},"2.46.123":{"name":"@apollosproject/ui-onboarding","version":"2.46.123","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.123","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"156ce4936be4ec4bd0420a431ffe3d8a6c02a487","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.123.tgz","fileCount":87,"integrity":"sha512-a/VsSUaiFiBNVYJJ1yLDYCtK8w5kUD+Xb//IeZPk2Vjh4BGsIOfQ2ZDuGzXQaA48srPdUJsxJ/kCFLKScy/ulQ==","signatures":[{"sig":"MEYCIQC0kjZUjE2ahNU/KtjBf2HunSIKbtqxvE8Y56BWQ7qdKAIhAK8NI3tJ8ZkNeuDcGYfhzeVwcYM39jiEM4ULMC+CzVO7","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":949357,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQ2fACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpRaw//VI0pxE9jdSVuN78BoehKbChCqN4SeTFjcGR7pNu2wAcaA8rU\r\nseEV0DsXHkp2+MgGCZoUojIlbZFWQxTslhfZSiLUY6bFp4qtDx9RxlKKMcQc\r\n2sZEpb9LzdtrFUj/WJ/ZrVICxtk7rcp0z2VB1aTjLVsK2fcTgr7VPJbtDmko\r\n88k6gkNOAi1iLmAKFGQxZAZwopPXxham10iSxMtAGVyUAuYmeD9S4tRl2UNn\r\nJnH4F3MLiBAVschpdA8WwjaYHIIGVksJeZ6rnc0p3C2SIKOG+0Hlsh81KLoX\r\nMI2VVbT1T8P/2d5HAichzrWA74NxiT4pC4zEI/Rys4iV41jCD0lmKEe6Z31b\r\n7fI1zOxPbk0jTWEOWTtslyQdQrmy6ASzacbjRE+T7n3ews7uQu+3QwQclcpV\r\nlf5EamMU71OFy0vAbH6ALaci+Tcqd5d0pq5t3brdJ+ZXOlR2VhnT4ADXnqy1\r\nEC8i5PgnikQL28kY8NmQ8B8W+agK3wGXAzJGRE5lCjKx5/b6BAY3Wk1oV+RC\r\nGn2Eec7Tttg6FFfloWigZUOXlgYocNzu+BqtPV7a7su2V8QEOYL1FFeWmhGv\r\nb6wkMTq4SdJ24Vw9hkWG5igqerv2gmewTcspDqxbm0Gx68nkm/7Ri9V1mtgl\r\n++QnDVzxZa7xMDd5Ol0e7w6FIQXhxZJJqUk=\r\n=uLdA\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"7104ba9463c89a42d7a7e9ff0227b19afb13a687","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.123_1648692639659_0.4033940639904945","host":"s3://npm-registry-packages"}},"2.46.124":{"name":"@apollosproject/ui-onboarding","version":"2.46.124","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.124","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"38eb5e441d6f1e9a10e47368c27ad2180a41c1aa","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.124.tgz","fileCount":87,"integrity":"sha512-+achzl4rzDQF4ePYgKOEdqLwHcN0nx0Dh7RlWPnll8cniwXR3k0lTBin1obnJZG9oMjxCJ+6KxsQv9p4DxQXuA==","signatures":[{"sig":"MEUCIQDhjeJmjoeN+fqckOvyK8qLnWPn9ozjLlO4+ONWVc1RiAIgNvNfz9/b86o22FonSJAQ9NSw8rJY9sm5Sj7gLtRuadA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":949539,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQ5EACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqy2RAAlM9mT8fAThxVWB5o5aEOyN8bvym/86odz1yefEYsy0aVK5jD\r\nYc5ItbmuLTBjku7Zo3DxzxTDzo1wUizt41QXFInCAIpcn0MqeW0wGueJ2Ut+\r\nOjmdxne3qrhkE7vZjSTXhO4elqYztVe8ypuQXk24zUpRRJzfXvdCuBlePzbs\r\ntZVtB3CAtuVx6psmZ6HyV3oS22IPYeqOXOwcJHT7tuOUyGxLOYpIWdS1BHSb\r\njO4QQenqQQZRMIgcgNB7yNfI/M7RCvqTGQLQdBh9PpY2LMQmaalJM0O9k8TH\r\nosqRVlUOQMZXH7s3bGA1BUvSP1qcPkFtrkJhHGidQbB/6Zw9wBzqpdTti/wH\r\ns0dHjCygQuVNK81PbL9EY/7mmhufs4GV7xrPtPPXl7WAwPht49DWTJlitCdj\r\nbETU/vrNt1y1AyLKw5vEeyLiuzk7hHD+sgZOAbGJgNwQ5EkcyBz9bjg3Xs8O\r\nVSqzDJPAop/7rrYlLHo0/lgF4d4q7YPk9TQNVRRYL+OBzD8obL2hNkXrmX4C\r\nG2d7vX/jLRah64nGX43bAYTyu12kpjD1WhHZ5EfOVM+r6zbp7QPVqW38h8to\r\nSCRVLeJtvbvfcHmLqf2Zo7tgkWODN0GDSsSdoAAJihzT1olSGrQv8hoCtaeJ\r\nEgrzLvM51veXHF4VbrB4fUTG21NTpPSMC+k=\r\n=R3Ef\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"4ff4eb4ef52501cdfae66dea4defd5c7d8951da7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.124_1648692804486_0.9997544510871528","host":"s3://npm-registry-packages"}},"2.46.125":{"name":"@apollosproject/ui-onboarding","version":"2.46.125","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.125","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"230007fbeb3f3efd5cd1cfa2d2385ae52c95f9c5","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.125.tgz","fileCount":87,"integrity":"sha512-kgZKUxSB0IQ456ZGSXNNxOhSoxrkJhlInruK3BI5Yn0wKtCNWNjInMoNviJ8J4L+rNBkB/GItg7jcWKoQvlp2w==","signatures":[{"sig":"MEUCIQDkLC9L7YFSlYLgg7iSgpNE6T5im+MWNzKOm4e8rOsv/QIgH/VyTP+3138QYpR+Fsv7q4lLqEsDv2Pd8l5zBJZj3k4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":949721,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQ8uACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp+ng//aqySIk1OsfkEywWZf4LtogUY0PQmnbr22/HYkFifU5uaGnuF\r\nyS5iOj6+QFSeKQskt9cr2uflOdBRx/KnU5SX3Oa4fmtvHjXOnBm/xCtiqUFN\r\noKUclYoU50Zs+3RFgfISAsIwx0pFWPAoupJjhaOgvIgDy8NJ5kkcWg6Jv+6E\r\nkbM5q1XakURyUnRupeeLxTBw9E6qutY2aLEO6VJCO1CRn05fnnfRHwj2p0lX\r\nFwIp3wCkLX/X/SpWlP7AjMbUo3EN7JbtNPx9ihzWmFeVXi2ZP64KOu15w1g2\r\nVPl+4+nH6vPUkC/rJVRi3Zj0R7HCwfnsNgTrqDRiEzONDeB7KiwqF4MGfdwH\r\nJMv96KOFMG+Q3cWvas4pw6kFrMiC7rqWtng3OTa2BFtSdOgmvyLKos/ipwyG\r\n/VOULKrtstd58QPvtt9TVLK3RrPkEe80TMSLypSt/3JDR1fU9BVq82rZG0Ma\r\nQk/z89lipKWdSMKoC8XHL+uHj5nnVCEcAv3mpWe7Ba7bZ4TYwm2GvhhnmaVn\r\neiBjt8h6p/erfdgwChSpr8fP0kI69H0Jp9v3IeYFUYRxa4iSn2bglSEgvxc2\r\nSSD55LMecEgU2PtNVOIxZPXYpI94sTfMfJ91IIgeBGrINIiGwI535SAM70Kg\r\nhLRXJYD/eEolfZR/uE5Nn4WBbB6zb/O1ye8=\r\n=sQjr\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"170df02db7a79aa10492d2d1b180b12be51176aa","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.125_1648693038169_0.6882790370660263","host":"s3://npm-registry-packages"}},"2.46.126":{"name":"@apollosproject/ui-onboarding","version":"2.46.126","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.126","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"45a4d9c2105c6a0d56b0b4e03152db0c9915d2f4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.126.tgz","fileCount":87,"integrity":"sha512-Va+wjt1rWtwBguwSAYwo3nkRurMeV7kve3+66HWT8VF7cPPyEqzf2H5NHBktAk9NLXr5PzCQjnto8GXU2VBKnw==","signatures":[{"sig":"MEYCIQDYFkgS8PpZyMfpTxsFa/5/SP8wgrS2kx+mLUIAe1z1GwIhANPr1Vpns39wYm0KviaBBbBVVdcUhyeyGJy4DNd5gkYj","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":949903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRQ/yACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq6vxAAnXexPirGVKtubv+PTx5L95QTE5KqAG8X3Esu63SEIdVMSPC5\r\nLVy3cWH3+Yqfyl1tVwZhZurng8vmvMAtHqS3rjzo1hmOKzrXNqw3PTHabwos\r\n/uhhFXNOXQMEMTWJ//VAd8gr30u7Ctvmd1X4CaYHA+9rLfvzSySkrcUbO4qq\r\n/OmxtLAQkgY08x3a6ROinA2p6G1Y6iT6W+dhLZY2jDyOAq5QFMozstlZZ6zO\r\nSdYWOaeqFpmaMAse+VsXISwuk0x5XTirZM7tO17aw/qwIqm8638dqMhOUHa8\r\n8PNNGW/al22jJrU2TbEIVyQGHRr+dLHBC5NJZtmNsVdW45t5/JwJjQHNpRtu\r\n1SSv+N1y7KVjJps+sWS5w87zIRaa2twboX9JoJPLHtKDv+B7mwRLI0fStbQd\r\n/rNhWG0SFSUlyFPoyLQVE9Wt8QeveXnbTpDE9mMC8Lex6lll5GP32koAJtAu\r\nFIc/4j4b55CvLj/fa9XqJ6Eyj11n7i40P9Sv/3Xa6yi6v41nZSgfPfzTV5TE\r\n8xd8K1HACXHkLA9m+YULKxbRLR3V78EuubdfZ9fW4I8+hVIZ+sbTgUeK9Akq\r\nbXEe9oglz/RQBE0JVPLSfNi5zVPN2RYi26WolCQfvNG9OL1rfFH5fG4lNSOV\r\nPPngLx4sUZCfF+gGPjEES1ogALfWL/vc1fE=\r\n=jEvJ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"cbdb155d987bf7e478f16854244138baa215e0da","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.126_1648693234326_0.060734524991775896","host":"s3://npm-registry-packages"}},"2.46.127":{"name":"@apollosproject/ui-onboarding","version":"2.46.127","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.127","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"973937d5dbee1c3d08114adf247461491689fb7d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.127.tgz","fileCount":87,"integrity":"sha512-wj4+ITfWlfMPlQAogg9HglqQpsMfs37JRwWeDxbbIQqLvRmhDcCyB+iVONOcyEG9ghaHDQQgjyDUZVaiBCrgOg==","signatures":[{"sig":"MEQCIFWwgwXpqwGgck98hZXWfpyNWxNoygSXgyByZbTcuL/kAiBXjSxhnjq5Jh+hwlyKR+ridOX9n2HCDMKdGwXM0hJzBg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":950085,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRC2ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqZzRAAmxcw0fx+kNm1JQiajBZhDKK0fw7XMWsjadrvIEsiuu7Zu46U\r\n8ZEDDAzMeoFu46aUqdPMplavJzjxYxNnn1NtzeTM+JG2xJ8J198YzNep8Shx\r\n9o038kQUxmNEs5CCB4EwuLKPzOpCZBpsrz9IAX74HDwX1OHxasngXQ5EIj28\r\n70s3DM9QwU/C9XCWk+BD9+nYYYVGDfnmnaQOU4fXia7lfoA+wgQ3ynAAeY/l\r\nzo4daflQRWbmqxRKXt/rRaJwa1kFQENSSDZ2/saLNj6+rtWcegh3LuN0z5vh\r\n/lDfQbwt1+xEr2EE7kWGrAay+Wxo4TYkO7hOX5UAlH2kyNfl761peFS8SJbb\r\nceuZzZ9mAeKILPtX7nIYwugfb2k+VgQv2lt3M6GELbu5jTro5pPYapyf+vfv\r\n34EdSv8r6bR4rDOJGvKNV3G1OfH42fsMtJov8UD8GV5EIG5lX0w8cFryO/zb\r\nsURu9353X0O8mhXbUqlIEZsyl1Mfja6pmv61IT3Ok4q/70fOOGFSRnxGJcpT\r\nRK6fUv37Zl0tcJzyJnUi62THr+eezKcVxwbjtbf037NLFAhZKbuzwz4RNdl/\r\neyjj/MwKLffV8SHYWb5wvw+0cyWwCl58hLCPNY/6VwyL3JsSCyUEhrvqJUxL\r\nmQUWCRnvCnWiOL4YA1NtEaQHP39l+PS7/x8=\r\n=AXgh\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"9af74da94ba1f98b472962187b26a2390ddbd954","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.127_1648693430323_0.6214099102595496","host":"s3://npm-registry-packages"}},"2.46.128":{"name":"@apollosproject/ui-onboarding","version":"2.46.128","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.128","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a60b878a3264e1e8f152ec6b0c7729148a800a85","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.128.tgz","fileCount":87,"integrity":"sha512-k6BGoLBUSFb8DAdlZKrH6GEVDHRBh8lkp8ut26+xKgHCFcMjpMvQXsza/g+0yNzh7+PyEwXBhs1jtk+18JGvhA==","signatures":[{"sig":"MEQCIBHa/W2seETogDB2Hyo9q/GEFRKS5RtiP4Q7uJX6gg3aAiBJEsGmyZJBUsEwBMiM60ya6BW5aSwdnCj8CReYZ1W+ow==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":950267,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRF3ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpfBw/+M+9Vv2Wfdoyb+XGDumgKpuYJ4VNwVFqIim6opoTABjDEOFPr\r\nZIomPi2CS23AixA8VCNjXJvUSz20pY7tgKLiTLVZuoE2BcFo4dul1if87fEq\r\nrKF9ADuVioZ+/YbvjadpngmUKn9SL1IJbLpcvIe/cBNSCgFNnJBvMSYIEElJ\r\nEt2L84AWTiX/PZFKOrfFnM7PEWkWIZT/NH1nSKNxEmlQ17HVXW8aMwzViu0e\r\ny9mKcgqipDhYrLO/GBv+RtGgkugeidqBfD/qVgyu5LJOjdAg7zvQZPyB8Awg\r\nGXh2oxfvPnLNA8xLt9pVpz7ouHdh+ENw+ZmCT0ROcG3oPVoQVuWZGkU5TbGp\r\nIpF20KuwZbQFeRvadChuZvXGvc6H6WaU0Xy2B9ZzNE/vnmkwZnGXkifrb0hk\r\neuYW8b8ZTEFlmx3H3OUlLFbJAavc0g1hhwkGLbBKChlK20PS16Rbe/FYNV8S\r\nDIHZnHrEEMzcNXh6SyLdt06f9w+sYRCBd9ZCepChsunY5SGChLb/4iKVIjMi\r\nYIZCs6L72jVNsscae92tctr3vLNVyj9IPudzB9nlFW5k6aRG5gXrFz9ciy+l\r\n1GI1vaWW17z+mA2PN38iGbzOvL8vP++LPECu+9fJO4cOJYORqzsrV+Mbz2Ky\r\nQy65kYuL1uHHFlTgh/Jc3xs4c3krn7p+YuI=\r\n=3oz3\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"2434bc07d091f8756829c94eb98251b6b21b5dc8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.128_1648693623123_0.6291043184785823","host":"s3://npm-registry-packages"}},"2.46.129":{"name":"@apollosproject/ui-onboarding","version":"2.46.129","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.129","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4f63419b769e87c2f7673d30a03c1ce7916824f0","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.129.tgz","fileCount":87,"integrity":"sha512-dslJFIGk3A7OL4eSWLlqNQGnCVdOUK9SZ3IoW1JF36HVCf/uxh9AAoQegAQrZ2PK7FluN1bpCHzZBAMWJ+k3/w==","signatures":[{"sig":"MEUCIDyiw3a2AK+9doAY3+aIOJvN8QNMFthZn/G6XLjvVZaJAiEAxuYVIrqR2czrd0+2g4k5J9s7gduAHpYBqLN2bLUDI34=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":950449,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRJfACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrXoA/+KziiNP1CrSPCILYaX8yAPsq9BvTEjFcOmkubYV1qIChoEsl+\r\navdKhE+Xq2SZUjSMBcoOSb7JVXErzQdrgXst0uKkMH6/rA0Ti4vrbOZRZaeX\r\nkt87agkUM2Z6byr3vxF1XOdJ+fnfSqcvalKzbQ7ZmsdY0C7ct9BWEEVzj7JV\r\noGjUJZ/UD+bocIggjVZ1P39L2pCQ5eoBTIH3sQETx3qjxsqetrCv2kZBmPmH\r\nQJBQzhpr1njlPYHdX2fymWG/ZF42O8YA7DfWLDwMJS9fs97yIux8kPldANAr\r\nGraT+dpRqRTVMiIR6vI7iBV4HSs9wMAHr1xAo28vZIY6MxJaUP9+R+787Rol\r\nm+slgUcdlXAkpHUBw5KY6YMcb97DOKFaEbQl+BSESwIozaI1FyDydpV/s5Ys\r\nPdDF+Hr/suZSwKJTq+3dBrqeC7puiB+2tbczIorN1ltcBxq7RDdy5spZVxiH\r\n0ItPh3HqilEHaI0GkxF/Fkn+2a8+FVZpdfHdLepzMYZMermo4BeolFFa0ZrO\r\nWd1yEy7jmHLeLZBi92MhFles7hnEk7rjoTaF3LSDZsuS0zZIUBPpymCOj9QB\r\nV5ei2FYYAhpe+wusWEOPdwj7M/aaN51UTB2jtGFJQHGpqD7R6cJsxeNKwSLb\r\n/K8mFJ5HJa0w5rRaAzAV8HlcqwlJx6znySw=\r\n=2vAB\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"391bff8f6273074ed6a4c87222dfe83fd200e4cb","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.129_1648693854885_0.07258272887314532","host":"s3://npm-registry-packages"}},"2.46.130":{"name":"@apollosproject/ui-onboarding","version":"2.46.130","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.130","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9f0295a961b3fe40057f90ff562b8cb3001e978c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.130.tgz","fileCount":87,"integrity":"sha512-vCMf0KElcU4LSKFh5QRnwO9lmtitUXAIlwfBePEqMP83a7vGxzGG89N6mqlbZamRTXck0If0VvzLjUV1UbB6aQ==","signatures":[{"sig":"MEQCIGTvTYq4Jj84yzc0MKgOyqVOYumroPwEUD5vPFGhwA6xAiBej3KOorqzEa00g4qXptKY6D5BV4RedDuO8qUe+YKsfA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":950631,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRMfACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoNIw//YUEerhpP7RdtwhOqfWBVelRApi7mOH2yaKTUN1BG1IyglKzo\r\nmbbhT1AapsE3DlX1BlnBGCO9aWkwXmAMI0zkB3oOhd03ZCwenbflKdU8Epyl\r\n9ZFRUrCErqOaXfBuDLuLyxFL+UtV34voOu5lKQ/UM9z3Y8fFe/ww9kYl5jX6\r\n7VtBOAfuWPH+gqf4BjfFf7fszzIbsFd4ZaOgd4dXzeL6JtUxKYTv1EaYYeuQ\r\nbHabOGnjAXUu+YI6bEUO/PUYNT1LuwEI7Uqf/R7HhEHRTLzME0NPkOdWIR6b\r\nGenuSDusizUvwWpMnoyR9hij2DO8SboF+bUPRq+Yo3T0aBux0E765tcu+D/4\r\nJOHb+AitjsomjqhbWf6X88LOGyGHLpDoas62bkIRdxhMOcZBkTymcxDm9qqH\r\nLyITILi/CcZ44qBvJMV6fn8C4d7hm3lzo8Llph70eHex5Mm3ZsMTc5V1SN3T\r\ne7dS/MbCWEAMkdrjWlnnsg1dIL5XfWcaPhapMiahOraMVBDTxUMcjMyPEazp\r\n/rFyrGtgLBoIySPFlR5sKsc5nRwds0DsQ1BeDfxJ34ZQpPXoNChNV+RUn56b\r\nD2K4zqnqoZWQYPLC/5j5DfaZCS2VVPw4s3In9354beP6ma5+eMioCYCF5yR1\r\nvg0aMzDKeysRX3uSaiKEMyZQ9dwVSpkOTX0=\r\n=hwsp\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"247aa37f85ea5d4fda1b24ddfc61ae1e449ff19e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.130_1648694047589_0.08187060662563561","host":"s3://npm-registry-packages"}},"2.46.131":{"name":"@apollosproject/ui-onboarding","version":"2.46.131","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.131","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"de2df3ef0e1ab6a4f24feca772c91fee8dad2ceb","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.131.tgz","fileCount":87,"integrity":"sha512-XxjiTAi+MZ1tgeQhpRgSlqWjzsK/pMeP6fA7XafXwUnTtpH1KVSn5anSx+aGkKrHhRaliMZYr9VXbaRo8YZq0g==","signatures":[{"sig":"MEUCIQDffzyoWfIsJvwZYxgEZVWCjU6jQ+TSS95Y5O6p971rxQIgVmleHiviUtdsPrtGA9+FGv3a88OYIKG9FL2i7jTLjkc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":950813,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRPAACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmopVw/+Pmd/KHSks+ziF7JzZHq4suAG6F3XUoZ1zkgKni2shTk5/CMG\r\njV8RW6rqgblsM7uqkdii0yyBmlwCzgW+Yc0JL1jJV8j/4fytWv/AM5I3F/sK\r\nNyZqczglwdr/f5NAfU8gRnZP5ObxLATXSt9NXy79kxP+/OVq5YeJxOxWbEfj\r\nW66CkkaLpmGzV4TaRZUO7KNscGmQzeXI7u8R6kMnfx4VKfWluggX5uyzT4Ar\r\n+TqTn2l6/WyjBcGCgDdOYEGw+oI5gcRvcFHY0m2hnR7O0ffFTvFEoWolMqI9\r\n3TAxmuAD21kZDgSeK9zh7NONv70swoMiFHds+QjsjzFNKyt7unOy+xIhn8xt\r\nsJPKzFJSDumUTt8tGZxCRY20e7B55FkvCz+DwBu8wtCzNeusCSOH0RW5CEdq\r\n07g9eaMUku39MIMHErAykXUELwTPjyDWRijFZfls7pzPBbwJqZwUVTWaqWEd\r\nNWdcoEVoEjVDtpN+G3L2+k7UYyEIBi6Uy17ceezH/qfnkOg2JHGTtOlbIQmT\r\n9MDk2s/UrQaYGUfLnKs9dZook6Xb0areG7/nnxSzX9xzKe4BsmtZPjsl3zkP\r\nVf98ymy8VUy8DCFyw5lFtCfo2fH6YpSiPYF2XI66Im75MPr0yvaqf1QqKdCm\r\nPct+UL4tBSxd0uyeNxh0emebvg8RJVlAOow=\r\n=hU5t\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ea95511c2da3016da0d00b21be0e1adbdcb36bc1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.131_1648694208018_0.02829171266285968","host":"s3://npm-registry-packages"}},"2.46.132":{"name":"@apollosproject/ui-onboarding","version":"2.46.132","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.132","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5fbf0e2f0b47d877e1951de587c3b2e15e55c821","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.132.tgz","fileCount":87,"integrity":"sha512-c+uNQ7W2ghH2terDV8yjpL3KDVJA3Ih/7tnVLrLc+0pGqMb+FHH64mNOlXgahqbpeitOcRwIPtQUTVmJYjMbEg==","signatures":[{"sig":"MEYCIQCAvlrXLVcvC0oO9D9Ss2udqEkGxCr/S/a0rMVqRiW4zQIhAOSjfgzN6AUgC7VxcPKtDTPYmOJiqmecjp6nOU+GLH50","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":950995,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRSIACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmohuw/+MkevTvZbzrMwBuYZ4o1nUpbE9TkxuOuB1ia2rkxmxxLQg/jN\r\nkQsf8zUobedhRHy9s20SmnKbmY17eOIKzFVH1n9yuQU6Yo3BMdU3+6nt+OZH\r\nCtdVj4+Ns/eZraBg3N8MajQVs1QjqAaEtU0Dyz8IcSogLFKN++TW9mu9s3pD\r\n6PPhchWu6dqPH819EFm1TEkk0BNtYWNXCNUYGZm79+u7/8D2hDXq+KIKRyiC\r\nhuob3XrDMlhDeotkIKSdKwIMCAQInBflrZ0njZ7xjHw4h7Z0/NZU8QV7dGq0\r\n8C6x6QT0z6Pci9VmeudU6i24rzrK8BoXWHT2kKdFVxHSTCIPXNRtP/zqyJ8H\r\nCI7Cs2J3LBBwIC7zZORrWslAigpphHptNPuAgVfLNZVRqQDzb4fzrxzczT9X\r\nISBmwKoQb6Y+8MTHHFwcAxPH1WOrc07LHeLLwUL3rYE0vglUY+Fs8q1OcXo1\r\ng4JXKkXgB1BIJcL0/O3D0ZabLwDUHoU1j6JvX3emMTJjGXtlZLjlyel4EN2o\r\nYfD31DeT7h4nsjx7rCiz/y4b+4l/jH6Yvpvo+FaBMksTw2Sc5qotyg02JXzN\r\nFACVXaMYXBKkxEkDUKBlVlNqsWyzjLTPN7ZkdCFDOoic7upS88J2rQmHeIXK\r\n0Q9wANz7pSGX8aoHwj18wV0T9o3fTSccz/U=\r\n=dLeM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ab807ea52cf2f3fb7b9573acbd079c87d8cc8f58","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.132_1648694408525_0.09695538470485099","host":"s3://npm-registry-packages"}},"2.46.133":{"name":"@apollosproject/ui-onboarding","version":"2.46.133","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.133","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"52d8887033bb04bf6206c5758ca810767021b2ba","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.133.tgz","fileCount":87,"integrity":"sha512-frBYsPH8FM1zxB3cjI7caspDuCaz6EafyhiXZ7EtcIJjI7TyTcUX8KkijFyS0rE2VWXUjnxiNpC7VogYUsA32A==","signatures":[{"sig":"MEUCIQCaOMOjK00G/xA2VF9wXN50b/yWyi8BvbZ7RHZ/QrAxHwIgca8vJ1ee4w5DeqMwXC9sWZnZ8DL3TZq2ngQG8k6J0z0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":951177,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRUkACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqcxg/9HMjGgkdK9JvcFphGSzncDQH0wCtAtHRLOO1qRg9JlOFaD1ov\r\nWMiuVyKWlPPijNbjEr2GEgIUyac73ABEiFUo1/PNJUWbH1cXO3ous4yve3Av\r\ntxZsBH8bYe+1POpD9tpp13PGxUpDUPmEnYiGqU6lvXFB/7qvrT8+Lj44efz7\r\nk4/LqB+vMDxeK16NzrwIb48kxz87ayOzbn9q0xrQytksrqRAV1BZt9cGNJbH\r\nwghybDV0JGvoPEHjB+W/mivAZVVTbBdYMHam7KM4xuAQmQ6fpr70aQ1aOKef\r\nCEiu/9nGROXk9in9C/bxGYETRHD/U1AIo74UiIm9eYaV+TWQDBd9rlkHLBk+\r\nIpumsEizZZ55wXtDicNF8KCfgNoOLoZ48LD3UFjWhwhyFfu1pfDxq3QLbaQe\r\nhSbeJRl83tor5ZxYFJgqFekzewx6BlYYDWfpKDnGJ0nZHTLyA2udp0FDfzso\r\nmvzvKRRY1BhWxr5EAc9Km9UzJH6+GODs4lTuK7dRaRZnGqB9/fJa0ySK75Jj\r\ntwwkdrAUAjPPhAXMI/sEKwxITlnk5ROmBFkik3azIwxDcUccUlJD5yWzI15b\r\ncl6AW4QgBZa62DZcKl4HgLR6X15vj0mT/wBiQUe4oQcLQPDHHzQ+v216sKhs\r\niRAoV08nG7huiRuTkgNCWLZgCVM3uFYAHsY=\r\n=NBOY\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ae9b4f4ac59f32045e76e678d0ea13fd23d86f3f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.133_1648694564615_0.2829294254844019","host":"s3://npm-registry-packages"}},"2.46.134":{"name":"@apollosproject/ui-onboarding","version":"2.46.134","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.134","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2a9f64d7be3ec2bc06ac1a608c58e089539a6b68","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.134.tgz","fileCount":87,"integrity":"sha512-+wN4+bLp6ic2jOy23Lmrq06HG7rj52QFWMXHS+yGYEdi9vY4i74WLDNMXVVNxE8SfHpbyhsb9R8PMw+nXy8mQw==","signatures":[{"sig":"MEUCIBsjW6U3Q/oEivZbpRpmB96HkD43ArCUD7/GUaSKeRAXAiEA+W0AwtapKd0kmtCx1xWas1FAPCxbLbiDvbkPzVNXKN4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":951359,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRYwACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqdbg/9FwtvHKIWqaZvLa8/POd7Qx6KZR3gGO34N2Cf2bEC6HUfwwDx\r\nfjoLHxF4DCjIw0uxMAeGWdXaOfVqiJCnoTC0G2yKptjADwwRw7VW9bgE8Swe\r\n0nwuEDT+hX7fa8OP/pozRCPo25SvFHsq+10BAB9nRIqNK/E/Wc0KiwRB4e+W\r\nUrglPK/Aj8s/6KuMMI4aA4rYFDC/163t2BJfVbNI+E2rQ8brptNDODM21lm0\r\nG6x2Jz6BQGJs6rwJ6Q0tVusQ9fqQzt/wPBGLXxsFsUJ1qE0ZCXMJ8CinHe+6\r\nfcJPKzEnOjOKAYw49lWbQoH9SGFS0Tmk7DZYUwy/sMMFuhycGip/tTMVtbKT\r\naEGDX2NVa/eFc42VySdx8jPbTovpjA2B8bhjBI55phvDKe42qKguHkWIYfUZ\r\npH3kfWdcfTqud/x7wxVqQOqFVZQfmO+tCzsWu05GdSDWDMIPQXs0VUpVfcDz\r\nVtrj/uS8dwhsFN7o5sbrJu5wrXkczeKB2jAvipmqJF9EUow84ymrCQTpdBiz\r\n2oXd1oEos+4WHc/hu33qM8be69L3Q+wOSMbW5UHqjmsMVBZQbwp5Z01T5Y90\r\ncr2pBuMRrqZmCiOY6xC1WwVC4iAf2EzY+idr41TZ7uW25SkCiOgSxa0A1iWd\r\n0GrbzxxfaIZj7D6PwCyu8c9MzG0DJll4efw=\r\n=dwI7\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ff0731aed63697e11b5640726b00d7c53a5cc1f6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.134_1648694832707_0.06293335497885799","host":"s3://npm-registry-packages"}},"2.46.135":{"name":"@apollosproject/ui-onboarding","version":"2.46.135","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.135","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a2c6e133dd0b5ccf3349b50620197d4edff6a259","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.135.tgz","fileCount":87,"integrity":"sha512-44n7q91G63gFXKcCWUzUyVq15u00h32o4371kDIh80bWXuxJJ2YE6RpZZMy5d+c+9xCdN7b9SJ0sgMBW+npXZA==","signatures":[{"sig":"MEQCIGAKjV6aeFWnDsBUmXaSQbAV53Ngc6IHZ/NLGvU9OAflAiAm2JXFO9CAo4gOhg5rjiJdR5SMOULrbHTnW6cia17dGw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":951541,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRa0ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrUeg/9HARgjTql3ww2Aav3DvXKi6N5gCD4dv8ZTnXPvYt+uuH63aTm\r\noFlpq3AUhhw6dmEX9lurbCnCKsqM0Q7F/WrK/ZqUJpAOOQYzzPO1Z6ANesQQ\r\n/fjgCNeELLJ2XVX+XQv23BC3yoO1weH6OlZJJeL8UIeLsF7tM+Wz59l2qYA2\r\nXnj6f29UhJ6gdmrMEZP+rh4u1DaofT4YzFeVLdvq97NmIKKuXrpjRnWX1BXS\r\nC8f+qGnJp0lK/DRfqoKHY9vUKof1PSbXAOAOds5sFma6X1iQigl7qlK5KTrn\r\nORxQ8VTAMW+mBYMP7vySb1yuaPt5AhaoEoSWF9Y9Z2KxLL94hXEj5ehHn6eB\r\n2S2RElpKMGeqMIGqZTAK9x0w4nMrc1Gbwh84MLhpBBqGq1jgAe+kQ1CSFN2Z\r\nWDyH39o3ROFfA5NjiHPlRIfXNiUPMnCHOQyahD4iKSEb2hvqCzYM71BjCGxA\r\nUa+gWkhk1brjr5iVFpAu0SgRtk2lCKv9/kMhh1f6ZYf7/jmBWw7F182znN1q\r\n2gy0fk6ggHRcP5h5wS2iJVG1iqqZrDJtCmKkzhwMzmougivpeGPZBDpTb4yq\r\nf1WRw6dNqH5Ytf3BtaSYM5sPFOpFTMOqySIf5gPCWPoz6ZyruqFdSO1ioNw+\r\nWcncEh1fOK2pMJ2A+Z7e3779VuycNH2nCYs=\r\n=OrpL\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"847f7ce9a1e9443bbf5921dcf4c59ce9056d7b0e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.135_1648694964623_0.7964344274442476","host":"s3://npm-registry-packages"}},"2.46.136":{"name":"@apollosproject/ui-onboarding","version":"2.46.136","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.136","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"69ceca70e76f875ab02046f43f2da469f4cb25a2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.136.tgz","fileCount":87,"integrity":"sha512-jJyKn2cxqJCHdd1tsacQvc+khLl01AZmR1dTAP+AFZWaEOdsQ8DcwT2jt7U1AiA/GJjGO2I861m6o4zNTuz7Pw==","signatures":[{"sig":"MEQCID1k4Bu8LlwN7oD2vPl1+Vg1/OmrCg+cTbUnybX2yklLAiAE0Sg9CMB5+VV2V3ZCd7ppc5IZPhnUbVNhGxsemzPmdw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":951723,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRReHACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoZqBAAn76qR7Unew9qFpBR38/ldPV71rvsOuYqFk/Pe885hUEUWzlS\r\nrrvnNb0mwscv9T6VQfzaBhX5gaA9b+UXCjXIhEQ8AtH9nDwV6aKaPMm1seU0\r\nItaaLeMAWmBZH+WrsTRkUsYhWzKla2X0mt0VrmZIkgvsfpk3zWcQKgyTGQ08\r\nP8akBDrqemkWi5S9xt9gtNctypy4gPQsUMv4Yhre+b4BSLhAdzzcPDBNJpNm\r\nphpjBlmsDdt/EaJm/ideYTajSBo32nao000E1Alz38TXsDVw8YsXDf/m3a3w\r\ncrQoL+GqoijaDSt/bxWOHQRKRC9RPVD4A+KUii1KyJGQaJlmepYC3h9dX9fz\r\n3Z7pQjy7QGn6R3pVZzqGEYof+ugFWDCUR780jpXhq9KCungJTn4j/16oNfRU\r\ng+P1ES0o5qSm0yHXJRoc6hZgsJdyoGjbsv0C3Hn47tMEmP6uYfunFo3WorDw\r\nRpQ6gc1kVjyt1sQOl1DIkI4tblDAQdhp9PIyRim4IglJMdZX7qkOZjrDHi+6\r\n1otE8wrOjFUiN7ZoVM7W5fK5WHqWK7SKSu3guGpQ6QEcZ8RlyzieFeATjgOp\r\nVWdIFhlc9r9oKNTKt9gdp9GMNBOo4O8gyUm7cu/Hkc4yZi8Ir6Drgcmf2fxE\r\npEMZMWZvzNmyZYQMhQoE3p0MFwCOVMXaTJ8=\r\n=1PWz\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"4ce0e27a1ac29199bac0abd3ba9c32cfdb29f864","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.136_1648695175269_0.6448563437866852","host":"s3://npm-registry-packages"}},"2.46.137":{"name":"@apollosproject/ui-onboarding","version":"2.46.137","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.137","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"20531037af2ab7b6b842a55ec2287be3aa51bd8d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.137.tgz","fileCount":87,"integrity":"sha512-sZB3mYI2S2f7dKjPpyB+uIHQasUCOo86Lx/SNoZkMbX1NZTa06NQMdd8s9D1RG/gCcvFTVc1Epiq19D0YmAB2w==","signatures":[{"sig":"MEQCIBFdq+d/ebxI0xAZxnCNiCZVTfCKCDVoo9keCQOFc3uPAiBcvGplUp/9I3PRUAmI5tuv4SR7VLh30qYdY75Gc6v0SQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":951905,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRg4ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqolw//RWCE/RLqameBh0AAgu2BpEzOxUjsKi675E8wWhmNiTl5A8PD\r\nF7P1EY/LGkTv13j7rPjIAQYxq3CfwesqgouBSkBfFdcCi9HImS3UkEpg1CLn\r\nuu8FWi1hHtPV5TWuaUy3PkE+DMnDJepEVVbUoXYucZn0r1lRqivk/xUaStli\r\ndwSUMQxtrLBIoeoU+1i78Z0sBJuMDiw8l9A8gMZyKiA6nFDjGcnsHtxKaSJa\r\nfxVSXcRG+VQd3Hb+F/YNxKbSrnaZkwtGy+NN4HBguGhdNPhDW72+ORp5QDNA\r\nM8MUeywpEqnRhTOmwZPkXT4YEnc0FtDI3Ii5iydAjzpF+kL++OXSkmiJBuIO\r\nxUSm/+zFGEf5c0opNkMidTn8P3Fxac12aQquLjUAs/XbzufxHdTspv1tsWez\r\nr/rJink69P9n8vWSAidoeU5XSWHm7QppuVKdljXSSbINsadb2sNqK+qMZE9i\r\nZPRNAIJhbEIJwMAdnNG4MxfVsdWerhxg5IhoYygLfXco0KlWuLuSORY58EX4\r\n7QWzdPg5vDFFVCwZCcqk3a4J/ystFXtEPYVF7a18E1SoPTDLmFKGBnrFHTOq\r\nPjKr45Wj73KkLq4Hte1y+jy/V+d6esHtVGBr9gvpKg3+oIGIDsaIlZfeDeX1\r\n/LjcLGLGDRFEg3h37iap0iu3FN9xfPj6LW4=\r\n=D9dj\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"89efbeee9d83b8bbc2f75aff54798cb7c6167b7b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.137_1648695352754_0.6778823066119164","host":"s3://npm-registry-packages"}},"2.46.138":{"name":"@apollosproject/ui-onboarding","version":"2.46.138","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.138","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b876f281b55df8fe46921da7cba969b23c58017c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.138.tgz","fileCount":87,"integrity":"sha512-ghlOetBn9mi2soD+N7nJXAbePMdOkGC/bA4/t7CX/5NwO9cmCabxIRqvN9WWBZ9AnuMguN8MHEVhkaMoKkUDqQ==","signatures":[{"sig":"MEQCIAj543z5W6CpKqH1N4EG7MNqtf6hr+SqxknPMrERXzyLAiA6PwbPvrpd73I6x6fEORYWn897K9nawzRidxNKdKIfBg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":952087,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRjUACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpULRAAoSCzUl5/x4yDjGC+m5eyLMK+QMH/6ZUAKFPNLQ0wDhaOn432\r\na2C4mpd55FcwcH0rmV+MaDGWwtubN8JKIYio1zVa4id84fob+PAUb6Db7Vcc\r\nv9qKS91QYeLj8hQ7QITQTMWjIEZswb/CINAaZQMC5VoU3SkpbgwMRGEABJb0\r\nxmlSXX769lti8vLMzRLIZ5umlh4SEC39pPW2zQTh4FdibnDQWSkS7VRnCpWB\r\nGCzXrboZB/+1CjSQgevrw6uBgx+Bbr8r7+qUpcSgap783LPlK7ePZ2eLbnWG\r\n5iZbY/U5MCls2i07lWKsc9g5sE+CcIQQX5pDkBpL/1pI9qHFE0wAjwM46VV4\r\npCt65bWOaC/CtXT9w3hSkdEoa4czOPTWwd7jEJf0hJviNOFsYMDFB2GAvJpO\r\njRsVfMwAsI5QQMX6JFCdpBqbXZs+gxBZx/NxxGHxzy8MhYUrbmxbprRh8jnx\r\nSYqBDu2xfAeC2UErUSAK3CGiyw6IPBoc4gy3qxCZykF2a2Ex8Pg5MSw1ysRo\r\nNYbJmIehkey7r4rEIBnURjYEcFBXNEAq59AVgC4+KpQgNM24nPAHUqnDb6eB\r\nT3n/SpILT/RCfMsmuLPanAck7gga5tCNrgY2F8UinSjCJIauB7WouVJHmJUf\r\nPwZCdXWBauDFaJ1nh/tmBgkg5SGzRUaum78=\r\n=EuOT\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"1f24c93d671542ba73fbc04896f17f58bd9a0a6b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.138_1648695507984_0.07781353509849831","host":"s3://npm-registry-packages"}},"2.46.139":{"name":"@apollosproject/ui-onboarding","version":"2.46.139","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.139","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"35e9dcf94cbf1b817e6c55522dcc1f691164b346","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.139.tgz","fileCount":87,"integrity":"sha512-u5zg8sf8PE0Be10Zm/D/Qcr0bdW+mKlw7mRbkkxGK6f0ke6XDpwgk8vPvJKBdirWSFeSQBJw6woEiCganbBsPg==","signatures":[{"sig":"MEYCIQC8a7hYyILxxiCeJwpRcOqMEXpz4BylOelDwbhm4Rp5tQIhAJTun9/U3ofUuMUunoTZ6ZupS/Ma5GZuMN6U1LA/6ZEk","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":952269,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRl0ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpCoQ//RnQxzBrgAqaY81HkeNx8jO4ejP353JpTzs6wiEEdpE1nMHEG\r\nQoHofQmbQmfBpHfQhr3WvAyqnhYvEeImemc/k5f+fE6t0Vg3mXfc1uhnTyUv\r\n5QzocvbIAn4Zw84EmU3+YNiVhiM+cIkDwr53v8INRkmDSSmbCbCpVUWDP8y0\r\n1hf+MHH1nhJDo48vbZGhopese/LCNVQl+DInAERzMr/9qof4FLLAkSyrSN0F\r\nvwQaoXsk7uqZmpxteNstbqNfEaeE3E73Iw5Ojwk7FsbPrqedDNma3FXOJXAw\r\n+qug5Kg26tEOgm7OopWONkOz3gsAWUZBgyf+StA+Or/Jm9Bc1Ww4DqWYTJgi\r\nADlbBCT+wUZkbG+VNBVSV+p7pTcoSdoZJ44kjC+7baCoOr+IK64USxIr6Fig\r\ninbIYrFJIuamHICrBZ12ac/D8V7E4KOiYviHRFEZLI+ewHAkAxa56DaEQB0h\r\n/lfDl638cW4QSI8tWRyDgX+JlijPANGkdjqb3bXgdwIdh+M+jKliZiJttOKS\r\nfmvX5FmUMGnc0nXKVutx2CV7EkDX7qk7+I8lHL5uu+q7Q08mOlbDSIrgbNUq\r\nyEbXdPEG+8idu9OD5uG2pRjxXYmDPr3A8pIuASqV5XhZoDaYgLT+YcTHxd55\r\neLX5BAttzWPM3ZK2J2/oAjIS4DVJ/Rr47tI=\r\n=jTfc\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d4abab01e4055734accb5897a4f53f5646d1fb62","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.139_1648695668541_0.372651019439342","host":"s3://npm-registry-packages"}},"2.46.140":{"name":"@apollosproject/ui-onboarding","version":"2.46.140","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.140","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ad94eb9608cac0d878f2895cf7790d2b091ba58f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.140.tgz","fileCount":87,"integrity":"sha512-KRbo6IXSoHUiOBbaQryLZey83tAxUaXccUhdY/5RVBzo2rf2JsrlIO5HdJ4b8kSU5zWbTlrdr9tcCmFL7YwENQ==","signatures":[{"sig":"MEUCIAJQIAAVMuLic89D8/bQR9nza/3Vs4jSANV2sW3X9QgjAiEAvwRBmy6YnR7hTKJ26Fvrw6LInfgUaUaMOxwcP+VhdH8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":952451,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRpGACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqIiRAAo9i/omTV7Khi52QPibeDdssng5h5abAEoINCwsLhnemholEc\r\njAE7qnSp4R4YvwAA8bWWUnnU5RIeIJpiFQ+5SoQgfhmpHno971hX2zAD9KDS\r\nE0vjHobZY/9UpE0vvN+EOp5cpAQErujQyDnSShfyLF7cPhAvgKS7J4ffmAAy\r\nDTUc4gZVwasXBbadriGB3XRjpYwfkuWChSQDJXMWWdXQpOhIl0nvMw0YS7F1\r\nb0FIjslUg2E4IwE5j96JfUhWclTdPhUA04oM8zz2z1xVtI2Q3zyd548NfNyO\r\ndi6SLQgSg9XDWgGg5o685Bo8giAbo/sLSXqamqvpmJ176p5sl9V7fEXM05pV\r\nXwymr00hoRG1D4+VQdgd+eIBV7PhvwIXBP0JxyqSacUfVyu++kecckOC/70C\r\n7rMDkE/YezYeeh+KVYHpVwjwepZSK23veJCFnku8PCY2kTfDNZawe9Mozfbd\r\n5PZPTu3004dfWAK4O28I1T6LCSXiWb8JQo1PzoHUeXbeRrUFzUzvnBQ+BuHZ\r\n9llpt5ibnX+qBjqwRHwK8DiI6ZF8xg8JhwUO36b506Ew63msid9jjn4gAL+0\r\nxJ5KOg9U10gYqJtTj0S6+51exierXSqiNvJuqfbFgk3qGN0k0zVdDUOzkuPG\r\nBHEx8eHfVBTSjbF3uUOq2ZmTYJPqjxkUyTo=\r\n=7vlf\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d90db71eeab7f19ef15231d48549f70e7ef542bd","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.140_1648695877966_0.4653139533760722","host":"s3://npm-registry-packages"}},"2.46.141":{"name":"@apollosproject/ui-onboarding","version":"2.46.141","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.141","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b9785084904e4c53ffae871174a76cf0357f9e1c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.141.tgz","fileCount":87,"integrity":"sha512-lOLOPi1W8uKyqLfPDkJPlWYnM0OuzvyXE9gcskbxUF8s4nen34K1q47KwLCCi/itu5juf3G/1N28q6KksmTieg==","signatures":[{"sig":"MEUCIQD3CrR8tpomNgKSN9ME/Bwh/9LS/1jdZ6wjAduWPr7XPAIgE8EfBparkZXpLju5o0xI0C0hwCfYX32c/RgrWCppWx0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":952633,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRrXACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqWKQ/7BbRliyxuf4U4+Fz98Trw/kwznS1aMjnnH1y3Jhyvax2RG0pJ\r\nvI6ZlX7q8Tua7Ksj63Acj0B/T4uKuCZKprA3N25lEqO0YN88ayOf2yBO56pM\r\nn8S6UQWdpxThmyXfDdsv1+yx7pPPVOLp2DZjWIWhmVq8xIWfECZz3K80rGRF\r\n3HmOOLq8logLTTw5k835CRlowwjVvuZKzXLkiwJuaLwauc8ttpF1H10RSlPk\r\n9vDVyWMQ0DbnSplwZUU1gZ/uNq2dfVdxZ0mN/C7is6HSanZudq+iPtOwUm08\r\nyYV9hSO/LoQxf5pLton7Q/yJjY1OQq+RSSHnOU4shd3GRZ+Y2a8hWpQwqlbN\r\n6AC5tauLNGFenc73po1M1xbCSIKSVkXvapwKP+XTiS+m2zJwr5TxnAEw+9Wh\r\nZetIjDzetNzZXr+6okPsJisvYw+qTW8gQsLOW5S0c0KFk5rRoWjojqysIwNT\r\n/A5V5UYZjPjbnWi9t2yyjHYT0LuJnMbdwmm3GGXVwJQMCHOuaHDQ3wlJNyaw\r\nkpPmBHFUAq1CsDWTKtkzPNax4f8lla03C8B6YKfGInEEDfbgjkHVwtOaryAl\r\nPGbf6GGWobOoe5iDUtzs/566DSRKbpF8nR56WEoMC7+lAZdg4cXeXMj3Do2j\r\nyENHuIwucsch6iWsTVefq6FLeJYZp/oElYY=\r\n=oNDT\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"9f9687487cf7db28f7638a3b600c627524e29bfb","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.141_1648696023090_0.6347052499601786","host":"s3://npm-registry-packages"}},"2.46.142":{"name":"@apollosproject/ui-onboarding","version":"2.46.142","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.142","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1f207f30e0870e0663143c11d908dd327233ac91","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.142.tgz","fileCount":87,"integrity":"sha512-vb7Omhafis9j6cSt/jKOsufoTgKfOepz0YDZm0xWB8JWgZ2MGO173k801jUKelqhY3CMGLir4AexrJeXeFQlIA==","signatures":[{"sig":"MEUCIHkVItfgZNJrSp4Ait0uUwIZOLtw3gq9N2t1r67WmMpGAiEA45mbe9EmdBiB5B2rd3d48UuXgXXkxb/DOb95QVYxK6w=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":952815,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRvEACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoXgw//cDvooZoxJTQE1T7htUnF7z4DbNK6mMBO0gqQB/EBcVBF2w93\r\nRiIXQsrty+eqOhYzcWlra8IxdxAPQ14v+a3O4caDOZ7eHbPl6w0AxNdGK9Ih\r\nf8ldKliuMlIiyrdcwVLHTi9v4Wp3g/q3dTRmwDiPMVvVzyx8Tp3Phv+fRaO0\r\nlfG5rwckbydgmO35cIzOhHweXBF+BOK9CrnV3STZKDelBauW4gIFE/NA2wD8\r\n+afLIwU+Cc3fdpRA7OCOATT336NrvWkRyoWz3rD01PhV9EASSD5VyVBkvHrY\r\n5mdvePb/zE0NEQXKSGa83vMdfhuyAx0PScBq1CjuAw6Jwcvf3uGbmriXQaNR\r\nsB+ezDCRqQJnKldqjZwWkodS/U4wKOL75PSSsMGr8F17OMzFBeYnunRbOj8x\r\ntjOuEa1Oq0pmlYdkH1g+kb4Vu3dVXR5aV29cF4FCzNnZP6dsLB5y4uN5KCi6\r\nkg6DxwbaNqUY0pHgg37cn64w7fsk/T2jQeuftLavu/BlEBpedVgTd2s3cAUy\r\nxfD7LVb5kCrBDHeMBXTgRa2iNM5R8DY8YbUqRiUXYRJpy0iZCcQqMRHkG0S/\r\n7P4bjezvjkaPR0TdZWyahf0a0/dLDReLBJAEkzsyiPAfr583JdO02cwBFXDd\r\nwMn4gSefbC7TSGTi1thBuJ36SKkd0h2/GA0=\r\n=1ERV\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d1234592b55577d3c2a697fc5ae4154ab6f5916a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.142_1648696259933_0.379192849665426","host":"s3://npm-registry-packages"}},"2.46.143":{"name":"@apollosproject/ui-onboarding","version":"2.46.143","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.143","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"25a246c9eafdb54b5de977bc54231386680c6226","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.143.tgz","fileCount":87,"integrity":"sha512-ImahuCMCvhJQg7a2Ws0YwfHGWIQhERvGZa2E7wR5bEEwHF05A/GgZRTTE53N645cJPJEHO1ugpRZz7oGE6SUFw==","signatures":[{"sig":"MEUCIDnkOXtkw4QZd4xVdZAQlZf3YDVzQs9yRv+qZpcFpO2VAiEA5+yFZsP2dlEWVeM7nC79UhP+Mpzyvv3nln7i6N9aINE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":952997,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRRyIACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqBNQ/7BJraNmfsfoQJe3ZaSRyVemunP3UKISjLZ4PIEOSIgt8jNGcp\r\nHLR6ThQrJF0CgLhiRkdb7ecL8j7aQmx0POOGeZnafyNiEYLPriUpD/54vXu+\r\n+owjHDQcO4Rye8Nqrs3XqPpBhHxPxMUjQcVBjQmNwQpsbXMBnYylf0kiBMhM\r\np/VeOXgzOscWKnGs/caelpP/Um2gf4oBCTc01hxLuALrWi8eLrB1j9pCLJT0\r\ncM3l/ZbOSaIhwhl5YDYWQScmtS1M1bfdNKXk6NS61MJvKGMGeb7Uj6++5e4G\r\n8zuW9MAxanXmszQ3IfYYL3KGZAizaVsvoH4xBqPPRr1hTS8yvGfrAc8FOAnp\r\nyy/ucKzDkdPqsOXjes53LN0o11lcqDfPGmOBxYVnhHYXKkwoShugCr6AdVhV\r\nVH7hz5IuO2maXr49XYi+vxLDYg4ipejRFIKQYWMiLAwjD7hlPDgIHc0Z7oRS\r\n/MuoQHpIx8QUwtFBKB6sS94CJkKcagkZUGL5ST3KQNOdXl/cC/raNcp9oUOm\r\njhHtUvfwIfTvQfZlVadD46ATdVpLV2DOAx5cpkWCnHiNjNUnp/us/WBsrKpG\r\nJLFu1AeWJaE2lEHjFfjo8njNCEMsiC3NXNyzH9vMLfyIHpov/QQPXO9jsQiC\r\nqxaHl+/M3F+0eLAb7Nl8HDoMP+9CDdys6CU=\r\n=sXkh\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d8f0fb7e1bb81ea11c772746319e5219f484dbb9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.143_1648696455903_0.7951786148660618","host":"s3://npm-registry-packages"}},"2.46.144":{"name":"@apollosproject/ui-onboarding","version":"2.46.144","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.144","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7769bcf29dc4c82e3c5e974b24d89560daa18c46","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.144.tgz","fileCount":87,"integrity":"sha512-FCiyW2kNoyBtCm/dfffs0oNZSbgXwZjafj5hZko79Pi+lz2KnWxArgKdW6dUarxy7gYH2jajHb3bi6m2tWIk/A==","signatures":[{"sig":"MEUCIGrRYGeruwWaOa+SwDdVJuH8krO+RVt6yXMx0ErXzP14AiEA00L57WQooJ/IQvdF9OH1gHL6DssmVKGLzRxN5z8Ns+I=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":953179,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRR0iACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpEIQ/6AwnGMR3yjmTUTjtPyXMXMlNvMVA5CFfmg0KMk5xogN5DWWaK\r\nR0+fsvE/jKJLu+JMY3O0mFmxLBgJ4nZa9YbILGc1nQReLUVrFQMXO2iQe793\r\nSAjIHKoZ11S/A5n5pkrkYiCgkGTLnF1Uqgf4YNUX+sKmchJ4uM6wddoJ9J36\r\nNRdGNr/LxpFEZnfbYVwPqhERUn6m4vL8tqiEKqrzA3XXy86IkyHPwjZ8QMHb\r\nEd1RaEfDMltlYeUPbJ61mOW7ppQJIKpdODEL99GbnmoY1d0kenhLsshvWQ/t\r\nUOMltjakz/0fDMCOTP+a0tZHpB/gvehCy2c4H8hikI0KyGCgAuRLcAP8hx2A\r\nx3ZlM4Bo5Cr+CvFyA1jmv+/SsF3ePgwZkPVT3d8wKlrUcly+n+0knEGL/pRp\r\n5tk+miNiFpzFnnrC62xZv3L1u5q12+0jBCVsZ0zRTaBB45dTm9GXjw2CZwiT\r\nlPXb0xlB1mPCaGYttOGEraxWhFUMfjZUXtaQWbwhtI2cUwSYlAGW1QB6BNva\r\nz97+V1QxSJ6yrIUdoPEoYq6tg42FPTIt17+E6XdpCZh1kf6KsUJD9FefsxCo\r\nWJgWqX4j4V0QSuXSms8XKVcpqR8WJ27uI52uMWN1SwE3wP4uo8PeVgCuCM1d\r\n37KhKzcc3lkSAe2109JYaekz+pR/mlle6os=\r\n=Xgro\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"b1bb1f206d66cb240700f252548e8021b0a17652","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.144_1648696610496_0.8682858643518507","host":"s3://npm-registry-packages"}},"2.46.145":{"name":"@apollosproject/ui-onboarding","version":"2.46.145","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.145","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7f8b942599de6e9ced299ea8ef635028149495d5","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.145.tgz","fileCount":87,"integrity":"sha512-LiyTr6AOw1mGaCKE7e3+QNO5XGMvPOTAqvgWJBmZf3gpvb55+BxERe3YrYal3a2tvPbVyyGZEOesI4qXJYR3uQ==","signatures":[{"sig":"MEUCIFU3PGvCJSFBlZm4Wh5Rq8hpc24KCL8EDGUE8x8XkjJeAiEAn3ur1jgn/ZAR3japsuKdBBCcUu9laAtZfoUX9VbLIOE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":953361,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRR4HACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr7ORAAkaauCsNmvsFwhT4nR0CnMsdSNwjoQBhJwxZ2fdBNdc7zhj5B\r\n+9d4LmwJdeXSSkJm/j041HfKVwmKpXXOTFObqklUhB5XSONrk+9qaXwDoB8/\r\nX03qhONk/A12bNU80DH9tt5Lkjve5/5pzl84KipaUfE1BqeFGD4xc48efd0r\r\n82KVFwwxpidnuJaUSyPSWiYmSsvfaTHaPAyeauuIhvYtz1S5ObEq6vVjZoxh\r\ng7QqpQN1QuzqORsXERX2P/1rkPIjpa5uJlQnl3HfW4SMRdi/P1ZYZs0/jpP8\r\nEBPa63bwEfNEErgQzKyXCmipPPyScNWBhhEDeQAyEv0Nlfb3sW4HhQYMxR3R\r\nxGiZ7gK8stFicPfvdmMZE/k2xfAo42aoD8s3D2O0rlyeSoQS/HFhfDGdG+52\r\nTYk/N4c6yTimNPndjjJHsWw5KoJxolH4EJSB84F3LuybuI1ZvbsxjrccjmUP\r\ni63fKT2L7TUk9iyKjUofQ/Oxb1saO/ce3fvWPt/XHfwTrcAntISf2SgEl0y0\r\nA0gcU1gKimjtgJ25ALjaOcEiJVBtK0kUWtCltB0t2M+Vd0Kjloip3tN1D8QW\r\nQ6Rd6SIOAeRZFWdOfvni+Rucd8jrtehEeUxsGSrHfgNKvNQPs95yS1BkslIe\r\nTDN+Xdp6QpHxaCC9JNRLDfvUg5slC1C9Y20=\r\n=O5Xv\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"7bbc217e125f890865f76684b315c296b4e55361","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.145_1648696839635_0.5214675703864633","host":"s3://npm-registry-packages"}},"2.46.146":{"name":"@apollosproject/ui-onboarding","version":"2.46.146","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.146","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"78083d028e11cab9e1a6dadc6d11be53f56e160d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.146.tgz","fileCount":87,"integrity":"sha512-yWRlWqXA2TNJfxlNh4RR4drvpFtk+yH67ZAg1by+OpxiXjt7P9u7ACRI8TRLcUuwd0efXN91tRE5Otp/bKStnQ==","signatures":[{"sig":"MEQCIHua6KiazZDPPrU1GoNcolHMpZOwWPc6EkfVvRwdgXMAAiBGrw930U3YJ7xhiYNLv77xYok1+R1/S6kUSKjHtuCkfg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":953543,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRR7XACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpxEA/9EbOK9TRVZdyex1beRh6fgj+n5zQfI7lnYEAM4cjog95o8f6u\r\n3YWoGJe4D7gBqXDfhe+pgrsTJpNjVha/cxenMga60dc5nEDTPvNJtE2PlGFo\r\nhxg5gTTWp/YFsAAdNxE+mX/8fEnSnOrGGpOzC3ADCjjOxyEvh1bkZ+m3q26k\r\n8cv+y/nCR1tb2/1/BAUECt31Fg29YW/XgOAFANgLRJgPzqZ0t7n9E4VQzglg\r\nDLC+zEfqca170LjEDgfDQMRakmbtgmpHGZz/O0Kr37XyhJLfYCdp/27rccUH\r\noaliPvXXwUopHkW2hJdJVthUojL6Ny5ydFqoOnLK32QUu9T6L/MtM7uBEZgL\r\nSqJXmbs8IZniUyPaDkbGZHhEd/EIHYN9FwgJr3voZ3GWl1N1mpJC7rxdOerB\r\nP2aKA+2bsW9ln2n6P/pl1OpwQaggtMGnKMWSDw/MovfI6xhfL0iB6etlYPGm\r\naW8JDmsotC0pD7HD6AGd8ks67qVRHFjFBRL/OIqmE1yZb7+1v1WUHLtqUIeH\r\n/ZjDE1QDSqJNCuM/pID0R493W3ORLHdoYPKrggL7o90kMWx2HR7ja+RnzB78\r\nKll8ELb4rjxWOBhG0Fk9GykFsd+4O+WteIqMnGy3CeuWUV34SM+GfRjZ7qFS\r\nxriNbjuQVRLz1XHS6Vg+tdD6icj961NifHI=\r\n=Ei/g\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ca052b1487c4b77d24d491e6d7126b46cc60f69b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.146_1648697046861_0.3119027507518455","host":"s3://npm-registry-packages"}},"2.46.147":{"name":"@apollosproject/ui-onboarding","version":"2.46.147","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.147","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6b2a99aeb4fe759041fc083b95bb3471f7bf35e1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.147.tgz","fileCount":87,"integrity":"sha512-YDubBfLkN/Im2EctRISv1fyjgiWytp33HzNVJMthkFfGjbA86syzqolUTcWUMXYmN7EQPjLpYIuEKyqzZIwoPQ==","signatures":[{"sig":"MEUCIH8jYBZoD7YjnU0C0IloJt+ij2zDk0IGKvxLMntO7BS5AiEAjhpq7SoiA257TL1USIZGZAR2nE7xBQoO19DnDJ7SXSA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":953725,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRR+rACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpiXg//dh8tHC+HnyvHdX9QvgMEHNLHt82VOzmMSysgBFi1rXX5/FMy\r\nQuPyuR6EpBdz+ukJiiyE12jrjXEIKuaBPPOSB/erx9wWqOsEhHpIdVQzo1o8\r\n5quOucVSg02nL24vnCEkzL0ym6qA3OC7qE8kkpqPXhlVCZysmUZzWU6UR9xw\r\n9WRDnbdHNmyD0m/iyr0+1+MDGr6CKMOHnfSX5wPWHRhnZYkvlxkqIFhX0vfi\r\nhpkNxDNLNBbc2ZqoDIG5PLs9vGk+b30Se36Gn6znnJWENtnrGaq4sPgztUVu\r\nmBvJ66BNH6UGHxyrvz5g18CsXfJsWlWfV5CdXK/2MEuiMdVqWDg3nG7aGR6T\r\nnlXw/e4b84w/aDyUnp/lW9s2TyAJIQRpfhglOk3AXlR17lJtbRezGVeVPdDM\r\nZNG8/8hFiVxT8kabQMyJchJJRNvP02+gErutK3PQWxi8Qg94s+LwZHr1hwkR\r\n43Y7hBWDFZObifhqskl2dD9z1cXrOJB1l6MP2BZUZC2KfbgxdJ74K+fkt3Gn\r\nrb3gZI+2FDxl7yL+fpunxQELyBu3WiBoEHamQ1gW1LXZVAdVlUJHVKEFkFHB\r\noc9pa8vSsF/qe0/i2jYWqnvMrVwdcLsHTiywcN/xOxeJ02LkpmVIkQb81MJz\r\ncAvEqH1FG5oGMZI43fo2CYGX8DrkK1I4XfM=\r\n=7nVD\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"11ac560fbad7159656a3216598ae16ce032c273b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.147_1648697258775_0.48922144985289195","host":"s3://npm-registry-packages"}},"2.46.148":{"name":"@apollosproject/ui-onboarding","version":"2.46.148","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.148","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ffa42436614828847ae5eb7d72cbb8d7ac837df0","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.148.tgz","fileCount":87,"integrity":"sha512-tpJ3wEM75hF2J5XkR+NdpigIfn9G1eU6B/oKTnUvSKFDbXTrpMw9oMNdbhfscn8J85uHPx0BTiWBNrLSuh8l8w==","signatures":[{"sig":"MEYCIQCDlWfs/CbCzOfFP3EPHL/5VtcDDNUcXVRSkYhgfRZkPQIhAPqj20/StVDp9/52GwOl66vudhfRxi13FVU8QFDMMNnF","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":953907,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSBbACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrPthAAlLV6jP1fXMr7WnbITZl96QoXxGavipIcQ+nUll/JFAcWGjh9\r\nkk8RrkAetQDf9W3FKzKmMfwVNL/G1z9PuHouiKuyC4AeKZvemEqmQ8T9zqew\r\nnMCbu7imyG5c39s4on/tJObckTY6DleGF+RwnmS+vibdAzQyfSg/IWTJX2Ki\r\nV3Je7irPBVpusjocXKSAR0jsG4L8as4l0iHQTfL9WYfp/SuzHG5p6iyQFzJY\r\nadW1qtML8GjSpq161MYypfal16FdXj0HXevQyNxeOx+ttjOn9TWW9uDxj1d1\r\nB8jLv+ZKb9VtVwXmce5Da283dhog6KwUHElgBt3zBzIq+UUjydB8aRAF7P4E\r\ngXYLGB5hAGLHSrKZqt5FpmozGDH+K/3QCsyS4/Fk1Tm1kzgI+CIIzJdILq1M\r\nbgSbPGagZixD7SGPIEqS2RdTO4h1LPr+SXN0AwnCVIFN1rn9I4/vCxKdrx5b\r\nijKimMUuXm4Yx30jlTeO3Mv6KBjbF1DQ7aK07O4kFXnE5n9p1wUyfh8MsqMB\r\nVV4cL/2PkYB1y3tRXDCxPz2bsqVptr+lyRIYAgIsMUEH2BXSBBoj2wBuzVpz\r\nxY8TSrZdrJYZo9+LR/uerVoLUZ1MfZyGfHK82CLalAeuByrB3T1Uo+N7JUZV\r\n9OpdyMYrDo74s5etI7wz8PyBeLjqGLdMdoE=\r\n=BlY5\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"805486007e214002f8f2395a13a8d81cf8714752","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.148_1648697435572_0.9274615415398946","host":"s3://npm-registry-packages"}},"2.46.149":{"name":"@apollosproject/ui-onboarding","version":"2.46.149","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.149","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a44981861b5c1bafce8d80715fd10cfa7a2ab296","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.149.tgz","fileCount":87,"integrity":"sha512-TdZc4rVsPFN9W02H0iBBbaHh33k/13yg27z+sn82pqGo0g7pI+mkC92glCuLc8AMv7gTv9CClbVORaBxM0mGvg==","signatures":[{"sig":"MEYCIQCiKiKu+BVoDyZknq/7uiJ8H2MJMrKGRYoTg6H2QFkgmQIhAOparHy2xq78tvp5sdRpcGZMFnuHfCk48XyasyRqGHt+","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":954089,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSEbACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp17A//WOOqAjDCJOHx2MWhi/D8pfjb4ugATaPXGn8hzGhRl1YF44Pr\r\nNetYmd8iyb8gFp7Shj0nQCn//TAY0edolE+PNrun54oV2+16VPNFndAnxiFy\r\nQitlXGlz/QmyQuIQXsFaD7jjo3+o02mt0C/aVuIixWbUQLOQnQXBKUbW2YLy\r\ntFy1q090Q56liRcbhp6d13V8RIFpLMqQXxTdhmwv68V4h5qLdeQycko/v8+i\r\n0L4p1mabUgkC6PT8L90JTf8QXvZLGpegGYzLKUWFLm868tRwH/GcpFtK2x8e\r\n+S1HIPN6u/D1nBrMuENbNyuSNBvDypGi+zfOZ+kGX4JtGrqf6D669Qzqgk0Z\r\ndujtsF405na64O+wWkPa675eHwn0ECMFK8nA7EIfPAmpR8Zdc+djVHWnQRlf\r\nw1Dav9JOTOP8kfjR5Vtd4K32mOsTeWUS+Gpo0m5s9jGzrf1x67nnTCsvYeYp\r\nkwcfb16kFCWAsL8gunx65bj629OQeyAbyw6YKTxTSLsemJ9lD8ANGSMI48tL\r\nWJlYube6CAUj5FBDzZ0ZPdBoRoDTwYTG+cK25o81Nd7erLPQ0vmM7dqJ0QSa\r\nbjLW/PhX7s8sFqJSoQ8SpfTXKO/jm9Q2n7js3wh7pQS+X0o68Y3H+S43h0kK\r\nNqyV4uNv78Sc3n0xm4OVmH+nb8gHl4XLp4w=\r\n=M80/\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"a05812956ce25631e9530bbe6fa7d72608acaaa1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.149_1648697627074_0.49492657567080167","host":"s3://npm-registry-packages"}},"2.46.150":{"name":"@apollosproject/ui-onboarding","version":"2.46.150","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.150","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"05038507e297d1917946586935ea1a64acf4f260","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.150.tgz","fileCount":87,"integrity":"sha512-hpWnYvE5K+80ki8mIB6IJciyRDTwnjBMsw8im1jvYMMRvrAaEx4YdM5RuXjbZzqkh7gD7yM5fYrHjIjL/Gw7mg==","signatures":[{"sig":"MEYCIQDGxWWUT6WmlzTthRtalqbip3F89Q0+DDEHXjsRBlFaEAIhAJ/xPocbJOOxHR+eWaEnBIpFQaWwomMZCwHpkcrks4Av","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":954271,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSHPACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqYHw/8D5OZTMtB27b5LOBe8/tzToO1gc8DWgJ8ipLHuDzxQmjaBd5S\r\nBRqBv0S6rT/sCAvCsIrGjsXK6wJhSqd3O7ZMwe9us6hAqYU2KM/YCcvBt9SQ\r\njHS8vtq/33l89qSSqsuAMykdIjHIWkvnzVn1T4IoYuLvfaAGNqF3KAZCyNGG\r\n3nmiiq2j78NJ2DDsDAojZrDlqlZkk2HhhKY2t+Ckhop9mt9BsNUrqilQDtGz\r\nDMDVcgkBB0sbnPRqxQQFOpqBlm7U5ECZ93d45XyWEhSnzSJkg80OPMdkjrIZ\r\n+sfJlv97GCkxOsoOHv0exlgBipy4rpJjrFH1d7u7afjJwpbZ2dyo13QKyP6F\r\nemnf8HXK2/w/ggYKeSHzxK8RI4lDtKj0TVzemHEigmftgFX19Utj4BJEcvXv\r\n90EL/8lljXkxbok54huTKcDY5NzN89qKBV4T2w5LbmntPJ9UUTdJYAdJJyAf\r\n+UOlh7Oeap64LUDf77wfRWREoHziKoKdJsYrXS0KCv1lShJwrnpnh5/iAUWx\r\njt78Q0xD+eRwzKgY2P4t+J8U/gPujDboL2vzngSlIKyCovHJ1akgKpsR8KNn\r\nOegR3uUXqEknnBwNu/Vq9CTOjsK26Izpwr4vG7bJ++9ENmfEWMQoYuOp294O\r\n3P+DHxfKSUiI0l03hHHWcrVv+ZZN98VXIFk=\r\n=xrZ9\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"f28a2637c1b059e39c0f6ecadd1fb4df1d43c8ae","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.150_1648697807324_0.4501410666434731","host":"s3://npm-registry-packages"}},"2.46.151":{"name":"@apollosproject/ui-onboarding","version":"2.46.151","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.151","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7ee4da742d0e3e5bd2ccef19566a9a5694b28db6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.151.tgz","fileCount":87,"integrity":"sha512-7olTpIz7v6CUCwMLIJ/oiNS9ciUjztQ+LRzfiwT4n6v2xYyN5UaZSQAKQdceLeZQaxsqkZyBIsNWAD808YU6Iw==","signatures":[{"sig":"MEYCIQDj3jRgNOk70xT9RPg9aQ/ApCNcGai0Xy1vysCzL3p8ZwIhAKFQosqvVgI5MyLxuKGqzj/fRTew/FnrIVILDdVUDX3y","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":954453,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSK8ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqhaA//Za5RFZfx/jz2+XqZ4kOIkQTNrDN8BQz9UUuYIb2hOxcZ4Zlv\r\nIK2aKwk0oxXSySc4eP4d5Jt0GkQDTY63FrLe1VVsf+ciwOreiDxvWZcQVvl0\r\n6SYwBSZ/QIHWKOAivUXR2Rx+i3iz5hg3sTjieK6y27tU1yJ8kSWkg3e4O5BO\r\nyQR6Q0iznEUx186gME22Pl40uKRflTwavl+kJRaxdlihWknsTmxsTOtvs1l+\r\n2D0/CaNxi/eka0NCnH/hSHlQSLOwyKJdLkSDd60eQIekOjEo6muHcLStOc2p\r\norT/UobEU+4JC1YdEr/d1njMuJJ9KtAjBvkfsDCEBTvI7iYl67Wbr/k1KUyy\r\n+mXjqFGUUvlYbHKS/bmSmTJTsdEx3xMLhX7GNQc/nKLdQqSGpg6PV0qeD6f/\r\nhA0hTQczo/Nib6OcKwJW/CMlQ+BPMh8bpK1Rsv3vXIG2j/EGCSt6RyWMQyB8\r\nYW3Xvenz43JWokcWcAopvSefCbMJRBsLIocpV42cZ4N/FHvsaMonU7HDIjIz\r\n35aPU3fawlr57QWeeVUmDJ3kqcIq0cQRVAs1uHUblUaxznJu05RIrc8ztfwK\r\npddLfir/nD5mS2YOpHHJOGpV0/dFbWfo38437M0vBt6BLUvxDb1uTzsXUF1t\r\n7CZly8trr3ul1A+XezAwAT6t7k7qsi6EXb0=\r\n=NI2h\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"79b2343ece5bc3316b86bc9bc74cb383abf9c9d8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.151_1648698044073_0.6405505924911061","host":"s3://npm-registry-packages"}},"2.46.152":{"name":"@apollosproject/ui-onboarding","version":"2.46.152","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.152","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"68f69881ac460873e60287a4caaf90f78bd688fd","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.152.tgz","fileCount":87,"integrity":"sha512-jitudhv1Lz7xtjUf+XYBpfwQ+lJzKgdfc4ySv+p+ZcXpTdTdTwMHMVBkK7/iGM6kUe81fTEyWMHEK3KFvEnGzQ==","signatures":[{"sig":"MEUCIDfrJtP2Toi0O4RXY9Go/H5M35hRMAiNFw59DVDRJSaWAiEA44T3pazG/nERke3oDD8BFeV17BkNnQW1rENHJqNqNe8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":954635,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSOSACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo0KA/9HwRD3BiS2Iqmc7D4xp/yV7ZWi4emUDrtAWva7QmqqcrdZCgj\r\naTsjMa5kyZzTZ0cee7l3+xd0425PdkxOYBKYngwRiPQl0ZnJyIZ8TqJscx4v\r\nzQw8zxd3VQGVFpOHNpyCk0+wVPGaC34UHs7uPs5CJJcUrNaRqBGQr7sNsx4w\r\nsx9yMZfzFf2tjCZdkYDIkIDoJ9t5MepIbgQmzr1n5kGKT5OjpqyzjQv70Q1R\r\nhDQJxaD/q3eY5wROG3O+Ol2bD8ayxV6Vt8CYNq13KTYoyWubDrwa0z3NuOy0\r\n98FdiLBsARzQ1gLnW5cZvUPVOieVCnq1e/HMwY4/TpTXKPLmmltbTO0uevsp\r\na+h3VuQTYaXP6g4zD/Cb5MJvbg+iHPsSq3r1Fvghl0kTXfAJu8gHlxk4g5PM\r\nO2uq5oA1K7eMAxyiG/4sSgA8Bo515lsspYJOGgoSTabyx8hlIJXZsGjtRjxR\r\nbRWCwkrfr6vwxkVoYjtmIgUD84FPUpVk4NVqrXNt5tKI+wHukEyO4kF8UiNZ\r\nji6stwl8q4jeGqmwmygOCDfJIC2m34GZTL4+OSXBlnxhde8zzKYqGrCKWnMP\r\nhvWbADure0SENeZ0rEVYxG2WBHoVAsGtv0Kzn/gAgqp41o4RLXYgoQhiL8Zu\r\n6SZHxIoMJnaOVi905j9oYYZoBo+BLsxaThc=\r\n=204/\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"3529055e0752d9c634706b5efab72f2b687cbb6f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.152_1648698258366_0.18596696076930996","host":"s3://npm-registry-packages"}},"2.46.153":{"name":"@apollosproject/ui-onboarding","version":"2.46.153","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.153","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"552efe76b981c867a648351e3b8e2b1198940837","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.153.tgz","fileCount":87,"integrity":"sha512-foJuBiIvrnOs769NNpe0h8W14xNnvtDS1QZNSW24jzrZSRzwzBlnqztvHYoonafKyJiPRUVHUbfjRR2XcBdGYA==","signatures":[{"sig":"MEUCIQDJ77CJiNKufDl2eAh1YGggqNElGSLjUZIKKje3i+MpsQIgSYDN8Qkoisp4iMIgp6SBnh5isM7FO45foD8XW8o+zRw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":954817,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSQyACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq81Q//ZYqF4926OFwx5L68GwKWoMili6Gx/5J69uR/1Zw/L5dgy8oL\r\nDjIwoS+QMKuEC3vXBl3L9M02uB6vbL34N1veUMP/GslQK8vW2n5pp1XhX35s\r\nIfWLDIZXHxZeE25ESX9s9Wg61wcx1dRGS08tntkDLcvCK/Rq+X0ebWvdm0Rn\r\nCs35HLCs+mzLUo48Awdyt19HSalwtDwCFcniW1vGln7hCMftqPFqXzQoRMe2\r\niAqf7SbFE40x0253YPYdZUmTZFql/T5pwly5ACNZzDzm/EAveUxd7uE4Imab\r\n5p00FKAYttSQSfIuhaBqySaVxolTBA1F9gEmF8fHLz7+dpbVuFypxjN5pDPF\r\n0ymTTRqB2I5yJn0u82TQ3kV4XAudduMLZSA8sZqYPDYjJ7SPdS6RV//8KnKe\r\n2pNlSVzR0zOp/MjlsQDd2ZD7d8PYmboV4rHqR/H2Dmf0K7zsjmX8pTIiLjcA\r\neeHBTLqfG/iB/3VlwdIzaNabCn4aiGVKlp+9cF6aP6VU3EhcC1r4v2loZf47\r\n6BgZbnzrawJweJ8EqZvzIgKYWBtoHDNJjVEW1peiTlokDxjNyDMCP4ntJqsY\r\nXk0+lVF6EFUqxilk0KJ/uwrxSQCLmMXxZKX/9cZFcSc19fwwx40SMHbmsVoX\r\nc/tLqxdlUJLogzIxkCeqq/hFFxcb08kiABw=\r\n=aOMS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"f46a3bdf6d3e2471cad550bfb6f0651406a593b0","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.153_1648698417983_0.6992860026514909","host":"s3://npm-registry-packages"}},"2.46.154":{"name":"@apollosproject/ui-onboarding","version":"2.46.154","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.154","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c25736361ba7cbc95d36c6bd28bd4c4e773b0120","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.154.tgz","fileCount":87,"integrity":"sha512-8KysQ7W+ij8xkVJ/NUX1x2v1m6V9o906BHfuRfBqdnsZpwRAKTLRGT0ecr3e5P/XWOw/D8zn4Fu/dNkw/Tq8fw==","signatures":[{"sig":"MEUCIQC9qgam01uXLjwjULYwag5jB/9VP+XMmFeFtIG1F7NyagIgN9FVSqZvsLONqRzQkNpkkru9oP3l2Jj2YrMu38ZExjI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":954999,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSTWACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq/NQ/9E3/wrTNlfmoNojBmSWgrbwatQc+MafUzBDYlWkgCbCvLZYeA\r\nLyOhjRH7qotRIdjb+2wVZdI5Z1bMtC52wi3DnWHsOYqmW3e8XW2PVzCkeVr4\r\nglf2c1ev1ybqU94eBYk7rvTk1NPvjGZ4N1TUCi2iMTJ/ImVbye3z0IrTh5b4\r\nbdofFVXIEgG/oTsmr7NEl5/ML5qohMY9oyaB3FtBLkF+2zuAeMPDqDD7YM1u\r\nCh1U/Gcqocx9mDO+VwHkWIrR1+/l9J/7P7TETmhLgu75zYPFyaAB5yKfOx/F\r\nkmEsvHKJnY0etxzVbH/MoPDRyEAy84BW+1UrAKa+smRN8D4vlJQe+abOb3Hj\r\n4eafdPLQk2/WifllwLKVVPcMcj55KTDU6+PUh3Weg/huTQYqCmxcIoud0v9Z\r\nXHg/m9LzQOHoQDTRYosm5MimTR0dA3xrtTDP5R1prrumMzi2KOOrhSEYU9Mc\r\nZXC0r7LWjj/nUdhfBesAeLXmS2SjSOygj1L9/MZTvzbT8QFn/QUpg578UXmF\r\n0Kxm90cmqA8DNIcO+B8uEqa8G1XKl6/Q8rkTFJfYeFM1HkKjfpJZ+Urw1V+N\r\nfTdpWdut/I4sOg0oOdPB88ECSjJrrZDNgDFLv5g5/A4TKw6QGc5+fFKGo2iF\r\nKGf/2uLvQV68e38M1Ljwq2PTYdL+kSLsWE8=\r\n=wxOV\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"782895379e233c1756d200c51252be3010410f66","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.154_1648698582622_0.4876036869995688","host":"s3://npm-registry-packages"}},"2.46.155":{"name":"@apollosproject/ui-onboarding","version":"2.46.155","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.155","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1deb3424c1cc698f5e03fb82f351e036536c1f4b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.155.tgz","fileCount":87,"integrity":"sha512-G1b1KItbxge/WJDtOxTemxkU8Nj4uYrrTczAOY+28ippI4itS6TekiBNCjN8TvtTEwJvV+/+V2t+B8KoiqM1nw==","signatures":[{"sig":"MEYCIQDrTI6RLb8IdQp/CFP+JsOqcakj/pww1fGiOyeQIOR01wIhAN4CPFz/m+kqIBJn0J8XUIBWSN5WTcpESyH73K5jSkle","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":955181,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSV8ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoIDhAAmZ0IT7XEH0iKFqy5gj9PMKoJRoBxp8ya/lw9O14gb+wJiBbP\r\n/RHvLWlWf2npCxaxNfjhYsAcoWoV6L/Lp6JP1PofifZHoeueJ4zE5RyEshuK\r\n515pdJ59TQbP2s/JmW6tcyySm2US2RZVo8s6SkG4PLWKhb89y2IarNHpbZZq\r\nwIgVxMx4PJ81YDpJa8QD2dDcdSyS4KwmPcWnGmXhbeOxZ0JAKeFrAK9cUzOm\r\nAya/6v5lt7XerxlC8GjxGkBxBoODAUw+jalLQzdYi+BUT3hEMp5mIi8ZBZoX\r\nHFF0bCXqRh21ONarbKrIGjAHax/B1clclCiHP7H1u8vM8JRid1d/6Ew5lO3l\r\nZLD4eVZXAR5nemyULGabbQ0fkSHW4zMVeBjF2t1yIIx4LmshkgJXFVz8JDzA\r\n4ZRdsS/vpLnyv9CKgRh43MRyV02PVhBeDmY6LpV4EWO/gENaDVx3RoF7EwLc\r\nbw98/FiNHhOqf+nNPYuwKZgrSGI82ZA4wsi1NOlqiDPBOX/4dNQ9Fy3hQX3Y\r\notzRqxi4Tdpu3eMcO5a/vaTCONpHuc1FB2Wvav7r9/TsUajfyJrd0NL+Qe8w\r\nTz4ztv1mGfbUjHhc3O5r8bR+SAC2uSFMdEDpnduRasMjcMecgYA4aQ6wfxga\r\n4PtLCRluNiE/XGUe+XYUhi2yZKBHU+D58Kk=\r\n=st6c\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"1877f771ea9c4563ed5d27cf7e28d8b6ba2498ab","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.155_1648698748534_0.2181699590605144","host":"s3://npm-registry-packages"}},"2.46.156":{"name":"@apollosproject/ui-onboarding","version":"2.46.156","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.156","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d088d6b99bbbe007361c497430a7cda76f415547","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.156.tgz","fileCount":87,"integrity":"sha512-woVe4FW4haLaA1iQwaDOJH4250xvqtyGArg/Hom5HARZd4vP+OCtMnwSfB+l1Pmtg/9UIWjJg1cSgDM45Pormw==","signatures":[{"sig":"MEQCIEwIMBvFfI4qudhwDLEoVkk96AG/EEvpMdQ0pOuzbwJhAiAbM4HLDSGaJQXbmOxW5BRRSxSkOF3AzQGHNlqEQz4SMg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":955363,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSYvACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoMSBAAh1amofCFUvjorElvo3kcBOLgxxrOsPto3OiPpPP8tWPgrXxr\r\nyWKuS4inW2+JFZW/FMR5ZF7IdxZmUQWxZ7jC2ZMmbsXpaZkUzc0Toim9xDso\r\nPFK2PNGw+u2RMtxrMM/j2NoW73YZCrGIeKz9ncUE3ueRVwSFaWSr5HizRh5w\r\nyO1WU6E3/62qdEKkZUxdvl3SWLHLh1+5VIIEc4zOj6OUldw/0LmcwYOu9MLD\r\nNsUdY1K4s2VNQWOvAbn4GE3s9KIdw3l60rWzUSh5RbSySAlHc7pteEuw5Y6J\r\n9USpXWH1L+BT4XDR746u/6eAGXs6FtD49wb0KgfQ2z+sdBjd8qA0cbdKThIj\r\n0JUO1PWQMtV2YNxxzDV88pK0oBgWVL+p3yqhpoO3s6oq6rhZnoV9WNQ+E05D\r\nHaoTqmK1bnKaY2qPbM4pnAlPMDLFulGfcQSbHO75IX6vSCiOG+NOdVwL4n+c\r\nAt9En/xx8u9kIm0RbgpmV4kCqzq+N/j6DfpZelU9JuBkI8DRnDOq0CRfuqC0\r\n0d1zWzIUkC7MckqSqJrFhXBqHDCaKUPlerFg3ehEGHf7f1V94nH+Mq5Kmpwp\r\naJklxjrIx9vfkLxvqk1dV/VU8u5FcNxHcKsbhu9yORsBi3XqW+DFvz0SSmMU\r\nlNj0e9zdV5iaQ8FCeZdaIt/oBFdEacQq0mw=\r\n=cjoo\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"9433c159b9aa68ccab833e16585acd82bb221a79","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.156_1648698927244_0.5082260280559645","host":"s3://npm-registry-packages"}},"2.46.157":{"name":"@apollosproject/ui-onboarding","version":"2.46.157","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.157","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7bb2047434a483d6caea717efee7c85e09fc046a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.157.tgz","fileCount":87,"integrity":"sha512-/mHGS1wDR/TcS92zvIbtr327WTU773P0x3But0O7PNJVj/JGq4unOlQBeP3pEPjFE7FoJnibybSUrUznDvbtVg==","signatures":[{"sig":"MEUCIQCGvbAtwQxkDa7ZkKfg8cZK463Ac7cn7LIkBkONOog2LQIgNVVUg/5KWsY4Wrp0Lt1gbUShGLg6mJDm+HdqZg5cQ44=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":955545,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRScdACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr4YQ/9F6JYJebEHOO7yJJxfw16hBEKMqIiXlXscb3guABiO3HyK4Wh\r\nTNAUE6yLywLlxmgyO9QQiG3UFHyiYeLo0ZFDcsKXnmlxxZrHJMN8JoNto0uO\r\n1uwEjuQ0evKTXffKNqMXij1okwfRtTnu6qDHv/kWWWRnorwuMVpm5PKhdj3z\r\n1o3F8RHrF+NLzKkuWagD3GLZR99iyQTZLLToXpRcXAUuoaoiF/Sq1IOTJRvP\r\nr1/3DuE8AG4y+upmn0er0IWKqU4UPllq8HaARWPTRVMyCKC2n6tKraqDvkdt\r\n00Cwd7G+eAk7/kxWX9sQMSsiDHu7yXLsUFoQIsNFSyunHJ6q3cpHFGGL3NlU\r\n/pj5S8gydzLX4ZOqzlY83aUsC+BISiuoGiqsnua1wFjm/NXKvWMooMeaYZad\r\nn2qPlsmlInrnwfrkKsfv6Cwpem/c13sjdsGw+li/fJBmrK2uGoHWEpOVEAf7\r\n/UYYyUKkl1sN/q5NYRgLAkr/QgwFesJnsFFm+Ro6yvSGtHlbAoNEWjf8fpr5\r\niXVnsGc7XfmWqRp7OcRUPBG/X1jzRKk832oQE84/nGiiDfeusg5TjUC/5WVL\r\nQubl0T9/vwzDAqvc7bOh69e2WYYbJGqUBy0ukp/HAoGr8rVS7dI4REPQjwCb\r\nsL0mP9MJiKllyLJPwqea+JcHhN2N9w/8rm0=\r\n=IV6W\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"0141a4706c1ae3aedbd2056d3831fb519e73b7a8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.157_1648699165703_0.7096896133958466","host":"s3://npm-registry-packages"}},"2.46.158":{"name":"@apollosproject/ui-onboarding","version":"2.46.158","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.158","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c4820c9fe9be026893ee2afb6adf2ae1ff112feb","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.158.tgz","fileCount":87,"integrity":"sha512-Ox59YlIinSVEtFAAg2/64Og5+aVAt+t2hcEPE5rHzQo6AEtC5PL/E+HonAbT7dVklUvv5J0uQROlP5b+AYZC3A==","signatures":[{"sig":"MEUCIQDgA2wAUyFzAWnC5pXwoCKIqqhRXA6PsWFRq/Jav9PDcAIge/YmdVb1DKKe5yzMkUwQQukmmjyBB1vjBqyP9RPJm44=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":955727,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSfuACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqaWQ/8DWrdy7LHSxf6uIXuG6eazR9IP2F874RQq+dZmMXx78Wst1cW\r\nIcWQF5LcLpr7H67+MvFxsThJUxbQ54D9jnu7sfJ+pEgzm8Ifhbi38BQXUisr\r\nMU6XoLoGpxrg2/iEXr7IrWzzSy5iRri7w6AYfzDf0O1kgGMRUb3pxkOrJH73\r\nz+RINeAuZv5EGJoPx0nkkgw6fiKqzRuGr/K3T07eQpUnQrkKNJPQrjTsfY9E\r\n4OS0oJGolcrQ+jPhoSTvoDrbcR562C8FRocX4A2HqA8irceUJvli/lnvgSZh\r\n0QvY6lmzvWNQPnGSnjQYoPB9oxkR1CiHKnzuFvDl6fos5gvgIQtaaJy7ogXO\r\nr2ShnuT9rPWgPj+Ofvp8CWNYgHMbuVDfURjyZ6O1Rjaeqxvt6WwyTPLjCBuN\r\nI9de1jBoXQZZQP9BoQrmv/3Y94RcKbeWnfxWR/YCski1W89aQOd3B6sB9oyS\r\n1KPk7w2YBSLSBONoXn5cKDXGOK5A3pZMmwFT39VzaWsZuSd+V5i3M/+Y5gpR\r\nXCHZsbroAvEJevV1Dzv2kVF97HyUJWiM4kX/xSu9I270YsKWf07mdU5dj7Df\r\na59hpt2wa1xVMRNy6WplAt81vQmVU7n4HPI+OMEmenh6xKYG3aUD3K8O7Zdq\r\nT/ykJ/Q63tFOsrG/p3gqDrpAB6gWy3gK3H8=\r\n=Elgf\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"7772539c55b6a87215708cbb0e828b13bd82df21","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.158_1648699374449_0.7564762884102882","host":"s3://npm-registry-packages"}},"2.46.159":{"name":"@apollosproject/ui-onboarding","version":"2.46.159","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.159","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"3aa8694a54bb452eefdde6cd48d6501b3bef069b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.159.tgz","fileCount":87,"integrity":"sha512-9I9Eh24DKI1f9AHJpnctUkf9J7Egy11iWyLNlMkqKYc84oChaZimZ3FGIhRW8+DFVlLuuLMQf/EeqtL+Q2lgcQ==","signatures":[{"sig":"MEUCIQDQ5KWEFk/VRbvumg+zsY0w6LWKUp968mEcX/ZzAnHZlwIgEcmux67kfPCiYZvox7Pvp64K6+UyNsmeiadYNvpBlSo=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":955909,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSiOACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrtbxAAlyuzB9rVZQcE9ZlXtKKOuO+Z7IVPl+lgmfCerB4bOrNoJ5EM\r\nhzSZSAiBz/TtCcdEswE8GURag/wdr3G0Ox6WzV3qm4pkFFwojaJ+Bq/CJUpR\r\n5TVohpiTb4JhYwuYwyEezvsgADrSODMwz7fv0p/S3QHKUVbAIEfPLW31DNuZ\r\n+HDrL30hbIxAzazpG9dquUshB8H8tNg1BtYmE3wMVxbv0iezyhzI8NrxpJeo\r\nWi7ze+mlH8flxMq/rDYzShrMVTDi/L09TmHqKlD4tK+FMSBm0HiOBhiejzVh\r\njcgq7Q4pNaR023k3uYnfOS0v0JI8SAI0gizhpDmKZX18IJ235WQdY6F/jM5q\r\nzeksY1CYESeEqj3rpiNqEMrZbbQiClrRZXRDR7BzJTSf/aFoudU6Eb8tbmuJ\r\nu0E2zKa7QRZffD3JCfmcHK8un7cyuFrUqUihvndmYO3iCgceQJzQlMOpWAVi\r\nYlanNuc0HTsqB7aBqJcZ4/iMPLaOTeCpbGUYrdgu9ppdL4QQUk5rldtzIllF\r\nV3tc7KnVUNYFv3hJBAL1kJSKf5wEejO/lX2XacvnGbdod7DsprWZhTbIXH/E\r\nU/xAW6bTX7G+UfXiMOPUDplY0Lh61CRI1jpNmFzy1jT2nDKXwYRWkNQTT0D4\r\nNe/tS34AFtrODgZFWDvnV+8NPplzWaCHVik=\r\n=S/Oh\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"8109c012ee7ea19712c4b657d048ff40fdc5c165","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.159_1648699534660_0.7012830915639927","host":"s3://npm-registry-packages"}},"2.46.160":{"name":"@apollosproject/ui-onboarding","version":"2.46.160","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.160","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ac772feb93b7f84005fdf01f2d640588346b336a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.160.tgz","fileCount":87,"integrity":"sha512-yI+RRek46QAuE20qG3UqmwreBhoxofCzWIsCi1C/uwsJgTIhWfVDl/ZsXcTmviB9qZleyZ1CE75uMFvpnHEKvw==","signatures":[{"sig":"MEUCIAGiGM4GzpJvv3kJMVzL98Oaub1WueGJw6uKeOcS4LWxAiEAlQ4XuStMe2N1w+Lo2eavDNGOaI/NBdRz7YV2XEMGKjI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":956091,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSl8ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoqRw/+OF81/hVJ0Q5yAbWgSJqqTewDBw4bnd6Ni+HP5lNXJ+DK+NX1\r\nakRubCVrlurRWeJLaCTg4O6vx9t2k6c+fxTphyMyrVZ1CIaoRJxEht9iwMyP\r\npCREQkpVQX346JQPqWWuLqw3ojP7VgV7sMnZ8v7oDxzmCX+dvpMACHPdaHwR\r\nK0gXZeIIKNfwPAlFziJ2D5+pLCbvGzyjoU0OuyaqawvSRLdpH2iON6VhuRl7\r\nImbxTZwjtrpnAMXUVXiVDD96y0IL7BIVOoMC2QIGC56g7nEc2IftGZR58ia8\r\nE1Al/ZMbo7HETS6HBWnQ3VrRuibjDj124R8GzIYUAUnnl+T7WJCT/696L/jK\r\nde9g2iq3ROwUkYRWo860QEDdqVekWViQIS6QHpUtbCP+TmS1LUe5iNHEt6qA\r\nxdNlMv5PjXzGJVkz2Dlf5+0gT6pfFKVj1BoqvIvdAalVpXFxSG2GFMdwjRJD\r\nIc+gkOU/plO3OSwt8W9Sp4vHykcpZI8i9TD8/3mLSq2zPUUEe+O0RC4Rr4d3\r\nZMgiw4KdlMhJyLzOcB/OBhEeX5w8LCg07jNSJ450fTTVWIFH62UOkWxJdh3p\r\nf7bBIlErcf8ZwuwuSMf/z6oXQ5k63exc5pGEJWqc9rJ4awZ2YWqvD85kAy0+\r\nuUjVmaTtPVR3l4TuCg1ZEi42JfrrsQSU8Hs=\r\n=68MX\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d7d5a359770d6ed3b1ea166fa990ab0e67e82d0f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.160_1648699771884_0.3547855786978227","host":"s3://npm-registry-packages"}},"2.46.161":{"name":"@apollosproject/ui-onboarding","version":"2.46.161","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.161","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2f14cccfe67357321dedddcc9cefcf3983b34c8a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.161.tgz","fileCount":87,"integrity":"sha512-P7oFCmXDSNT6bScZhby1H1y8mLYtrefxVkLBlQfSfDV+YeA5ZumhgBS3o0X2YDmxzYMqRio/0qWHhV3/GpkHwg==","signatures":[{"sig":"MEUCID2pAe/TKc3SxDQK/RnvEwmYK22MU6kv2BBEJwsG3RZ5AiEA5eR1JUQ7DLcziYBXmSQg+/Bxhco3j4hbB50BEHfZ4VA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":956273,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSoXACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpo8Q/+JPXjbLCjxVfMjolOMswfsHDnbiztWLKy6d0bbumzaU8Z29Bo\r\nnYsdDxvc7BbUQD7oVTREfhW1bFaK/LQphAZoCAxjpxZghgbnaYVWEiOHMj85\r\nDlcA9Q+Rwj/V15JnN3u+6kMscj/tamL3e1cHGru9B0NZN9cOsXk+7+SBmLgj\r\nlXfjs6BC9wWbSGWoYYcerc6TR3f4C12xDW2XiYXRfWtUbGVmCNVSdrUUFlaG\r\nW8DSM8rXBmyQpE0P0ArFS3JyWTbmaccBE+sIA1IW+Hm+oO/GMhTgNXJQv69l\r\nWLa1q75vLJy3pRZwKK9rvtVBR+sHMzx0zNi9kb8O9Hc50GGut7vOMbfnBBk/\r\nEykU3xEvrHxvqCV7/sgyZN9aMb+osECgZL7jMe6TUbEQUmDQz0QYWVTwBYm+\r\nl3/HqOhPc3tcDTOot/Oif4v26EueqnWzOhSOeGdI63ufl7is06bo7ENesVmS\r\n1zMHUIFzF/gH/kMNbQaRGOR2njroeYdfEuIm4K2iIgP+OA4+wgGIcxH/dD7v\r\nrskdZrzyzWnP6omONBFPJ/mq58ZgMdx1kWt+qvQ4PMB+Wn1dZutWvPSAUPea\r\nb/SQRZ0xlrbwid7xicOTFfiZesW+hZFcnJeLW1v5LtP2mmQpp9sC3wJ71jeY\r\nTTc6ahgLugctBx0wlRLHk3aQPsyRsPPnVAY=\r\n=auwL\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"7ee8157b7aeeb6488c4e79847384cef9c7b17981","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.161_1648699926938_0.13838803633292796","host":"s3://npm-registry-packages"}},"2.46.162":{"name":"@apollosproject/ui-onboarding","version":"2.46.162","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.162","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1881192761e31177e79dc77334d16247fbdefe20","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.162.tgz","fileCount":87,"integrity":"sha512-FjbQzKoJCGMkb62X6yUc9FWWEoUb0BoKGn2waNJqHlacDLEAqPzapdFtzBJmYLfMl5PF8E1xFztMxLvibNydsw==","signatures":[{"sig":"MEYCIQC3x9htGcuhY+2X5WTYsCyHV3D7Sh2bWbmrlLGSL/2I/gIhAMKVgp2dqahK5RmR5mQ8EABlqEzC7hURDu2EjnjA4PZS","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":956455,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSq3ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrDow/+Pqja62o6g6nfcZM4j/CFn5H4NdHwuydvAilmXFQifP2AuQLQ\r\nL8N/WPX+l7IYG4X6Fi4qqgTPJtyEzBYvoLNW3ER6J/h/PWFAqoE2jcY7lVnV\r\nA3eHSFHA5nT4sdhfPERzLTYdRZDs49zPiLKihCZlqsPVwhgTj2pRxnkXlyP2\r\nu4dtmMQQZ8Q3kqyC6CrTFhm83ch30IQdYNkkbLCQW0cgOPFmHoIQ8bTr+vLf\r\nnGKd4Tk7MVGjWO4Uc9SPsiMgiRdJFQZUpqIJVCcUWGs6to9gHdzUCLczjKCJ\r\nXxacDw60rlIZORbxuot6+yOK4Op8Ec6hU/9B5DddMn6uju5hCX0iwF1YbDin\r\n2tMsu/vUoNmh32sgwuiLksEn+xiRt5y2pt+qCfbWTaeE0mczPR9jmlDywwqB\r\n3XRkVYGzu3CKye948yqw9t/YOiRGhzTqa/TKaihjGwa1ozgtacxOB1CC2w4a\r\nktyB7Tihx9RJlP3LwQCP7fjNnu7pwSd0P8WAnMuukz8npVDonzudbAXIi6up\r\nOAcqU+BZ8xnhoW22fWVQklas/0gQ2noE4nB4OezBLANbw5kXwdiNqx4BJJRL\r\njiGq25JYLddqytDVoK4/+XwMuImewqqJxClVTuKrDjkZC6D28A9i6vLQuk4h\r\nNeXrTp7TNjW0A9uYMEWaDcllLWTUhblUGao=\r\n=jTj2\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"cbbae594c23192afacf7e812d6f04bdd87b86e34","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.162_1648700087709_0.3493518352465461","host":"s3://npm-registry-packages"}},"2.46.163":{"name":"@apollosproject/ui-onboarding","version":"2.46.163","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.163","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"86d8b35e211e74b66dbd436151292d31508c6458","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.163.tgz","fileCount":87,"integrity":"sha512-z5f4se3bwsW528xj7dfzfIqBQBwMEI5kurzDCY0Yeh3h0WFTaETWO9zuBy080j5L2QLFWrTIP2/A1idiUg6rqg==","signatures":[{"sig":"MEUCIDld10tv4eT0qsJs7T3TmIgh8z4kNHBHmKkAdHbIW4d5AiEA7wf1Vp6DfiEvApCERcB2wdUio6J8sh29s9qyVUe3g0M=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":956637,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSt4ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqlAhAAkt9rz+JX4D6aucQAjiqGxvvcL0M/q7pxuPkL4Au8adiM0I/l\r\nu8ODpte4cb2QOt5R6Xti3FEHYnvtYW7jYstr2RdRYUMR4TbDeQYC5300uNaH\r\nPlNR9bCXuQox5e2AEw8/9xV7lCqgfB4rgqgoX7CoQbYN6gDLNIgvV6coNyti\r\nxyTECBfiCYY5ckxVsmfsd/q2mqeEdOly4sJ1v1V3CgvQ3WrFQNYqKPhgkpvy\r\nRQsHD1mvdgpeNvfuBBEbQJ9lrnJlXzveg8rV1sC/eww0YD4sV5SQ4jlrwQSX\r\neNWyXakZRx4R6tinEn3MIHr6qv6RdV8h8dhf8HC64JzZy8RahefzWKHgXXV6\r\nHXncG5uks7/rA21gpM0nV/Z1W3aTGbKqpbb7/6FAozZWznMXKhvUheu5Wops\r\nc7IfPcAXDX/QNbY9YBgPb6jqEiTjLhkRk9EKTwM+Rs9MFD+RAqWCepJi9ldw\r\ntXfJbXVGn8P3c2a+LjNVDzojk6ZxGdIyVYHupyJZBjbdQULuexoUI09lUG12\r\nNUmxZ519m5QWJiQyIm8gpro8emgIca4x30Zb5JMlR+AROtoyvU0fCu144Qey\r\nx18Cz/ePJkbFqVKEc6mduurc2BhCRrvyxB1tPr+ErmEmQs0HMNPRttnCrJ4o\r\nR0shj8z6GGOEu4PlyaiRrPfqA07MjsC+z78=\r\n=caCS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"02826c214e04b88798be9041aa51d7532593e8a7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.163_1648700279987_0.059885248494531806","host":"s3://npm-registry-packages"}},"2.46.164":{"name":"@apollosproject/ui-onboarding","version":"2.46.164","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.164","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"56e3271527fe1f3b5d9c7983ff6e256e65b1a5b7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.164.tgz","fileCount":87,"integrity":"sha512-JQ8XqZiY6FvdmdkBkRXAGiavY5rasuigdgyJN61C/ULWfMFmsoLclKP9NhjSkz6zPlSohUFXFbLbFbbRewE7IA==","signatures":[{"sig":"MEMCIGsqEEP0MogYlKjCSeJUXvRqiCFum7jb2k3oAKkaGpviAh8msIoJz0M2bcd8INiL+nnCGUMD26TGpNRO0nD8hiJ9","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":956819,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSxCACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoRzg/+L+XEQmeYMngjjQeoqDamgWF4rgyuywmli6kuC/QhVwGV7Hb8\r\njuPJlWgTjFHI606cxUd59Spbyg9DQlFekrG3ORzAIp+gJu8cdekxJaVBjxgE\r\noNZfPPOaTrAdNCkRyd7OpWSSllen+iihaeMUnFg8Fv1Zk7ZT5SgkjRRDKpea\r\nohX5mNRFDfcWJe19lmbdIeXd6DijXuhD2xneQPZgW23BC4rTq+C7dKlj5ijv\r\nqJ4jZhhhRVPp4qxbNwW8/K1vWiPAv5StYbRVJJ58qjaFjc/8pztlKqAJe+uk\r\nATaH/1N45+n7pUhIhZa5ppcb0+AVkKXBZuWaeV9aBAdgXlpCVyxCD9zZ7gX2\r\nVTDpR2ufkma3uILeEO/cxSy7Wb8WGwVvMVpGzWpYP3C9ZiymUwAQzr1GZ2kC\r\nIEnUR8t2o1AclLO2Pu8lq/JBhIyq6RgAoKpZGbv6AzNrkuTPWRA4qjWEZvej\r\nntHn9DnRcOOtmV2lHBWE9QAC+M/zxa02yNgq6SJJdBy1p0lJ4e7izu5nbeXJ\r\nmXMtGZj3u8aE0GYznG4TiK0eXjbXUPwAvdmpklUNCmztojTz42bja9Ed1DUP\r\nSG8OwfoZtzPS5iJ6iy1MHf0QtOvVLv98tmPrZq6Xb/poV1ON02f/9J9Mu+Qk\r\ncTxoNYhf7+eXYGKD7eU2akzni5dKt6+6JBA=\r\n=wZHQ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"1b413456ea127cb192e4371db1c50c54d3ec9920","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.164_1648700481921_0.8875898062431498","host":"s3://npm-registry-packages"}},"2.46.165":{"name":"@apollosproject/ui-onboarding","version":"2.46.165","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.165","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b9a32fe6fb22bf32a62c2496a494f47a573542ce","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.165.tgz","fileCount":87,"integrity":"sha512-dsdFvhECR//Oj73sZrtm6WSznBXfBRI2Bq3qWHzyhPWtscr0Qlu3/bwc1jjct9mHZhYsJ1CPl47qNdMckDVOtQ==","signatures":[{"sig":"MEYCIQDjbYrch4nulypEEKO2o77LJn1rUxvVQJVGrHH3kJII/wIhALlDTcSUUTuDZNzpgt9aweHd7PUE+dztoPujxB3x7BDn","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":957001,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRSzdACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpqdg//ZD1ZKgyqLpKhRQ8L3xjRMiUmUax7UnTtQzvPHwuVcpe1yWht\r\nvpVRbadJh7RieyNkg6NC0nKpSUQTmjlTmN0tS/6V5YgcthfXX04xVYNJZZfQ\r\nngwnjO3UODXyNkjkAkhnd6aKy2sO1iQYWbnAP8AmSUW0NRS3akOVlEKn85Nc\r\nEohBsXVLEA4LFPTJLqXp7Yg22VsQ2SYIPLFN2khftsZal3027dx8nyni/xZ8\r\nMJMOuL69eQfGWMGvoD+mIL1LvEbjSwiqNPFAyeD/GJW6/GIm4h511NMfOELY\r\ng4w4nStK3Wc2x/Jemak+DQUVs6ODc4roBHXklM8liR+fvynxXmfsDtCnu2j4\r\nFe+I4VUxEmfD2E8dLQmZcSlFaH1KN/UXfiNI35XyML3h/Y1dX7km2EK2SC7n\r\nsDdT9iJSNnPy6c/8BjAg9QP5WeNo/wtLp7jtt3xE7fLuz0c2Zs7phczlAm21\r\nyGTAFSNQBJKUGcoIbcVaZh5IBGI/vjBw3Ok/YlWLcRleO9uVZX4Zii17XUeU\r\nhuV6J1HVQ+KRFp0P4+hzE6sjdkUT9+rGJyujYwPOddPsMf/RUh0snEYkvp44\r\nRuLyM5UHQHVeZCMLB8OAr2A+6GCxzm5OOYkaREvrhwfaqi5mCoYjm8wVhVWw\r\n+P4aya1FZCyXJ7HdBCVecSupYIW1SccxB30=\r\n=YtbZ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"b654a8ab63fd5d8461fd0a02f92e367f034dcca3","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.165_1648700637486_0.7226554016184745","host":"s3://npm-registry-packages"}},"2.46.166":{"name":"@apollosproject/ui-onboarding","version":"2.46.166","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.166","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9c48220a2c5a6a4f0c340ec1a2c3f410ac9bed0c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.166.tgz","fileCount":87,"integrity":"sha512-HbVR2bfXjT5En9r50I8WPlFAx5wMvdBg3WquKQHetHb3DUAVa61jz7ymLzGHES89zV972uvua44cJbhn6uEdiA==","signatures":[{"sig":"MEYCIQDeUUrzhqDTxzloZumWu6r5qz2ObIcHimp4wXAxB8D5UgIhANGI2IMcOgxWp0IMDd7Z/fR4FeLC1OjxCgoMpIOJ5ioY","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":957183,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRS2EACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrlOg/6A526SLt64QIkbe4cXI+LgTqoklBRBskfOb0J4Jm9RZHdyhbE\r\nebcd+WAu0soRZWrXQqlEAG3wcop9sETVI2IWbzDptSi/9gSRd6/Q3DCEpmAB\r\nwsXsj4BHlw6VQ4TT23bhuVi417Wr3Wkh3AFKKsEoSR4MHXnfC1bE4TJikDaI\r\nl2yIfgrYodeg6GEbOjzZ7mvXamj/8GC8FmvWRi+0CRsCWxFxEZ67bbRrIdMB\r\nWaGpq1qz6VCBf4dBufudVq8poEOriPbcNErkX7nVW98bq3FvyWCemMoPMWMd\r\nl0/VCkAN89PN1VXENi2R1M9yscPLsZ5os7Yjgu9NTHBFCqW68jIDs6j/gn4O\r\nWgiwZ2/Q58tIy05FCZreUn6MxcaalXakZ+qxEUx/5k7WSOeEOwhtt4DU6zb4\r\notZTkQZl1FslAll/bqS9OeTy3Ea36ZLRYxmsYuvNTBU0+BJm5/le9J3jTLfk\r\niy/R2Z/ZioqX0DfAKxB68SXCN0Q163YeN/RuQfwvXMjoMFKUiq3iRkfCYcHv\r\nCvVnSxrTTETwdK3WKse5dEf9xUWYNe37PCz1C/IqKVObws31E9Lvv5M6dyYy\r\ne0K48P+4QoXF8qyudQyKNrGzvBjZ95FVU0wYdbuKSQsn7DDrHuBGmm5wzDs+\r\n+T1CZ1NdoOvYt/E42M39iKenlyrnYTR+26g=\r\n=82He\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d6767e9d503739cb5846ddde3843b6f3c4986e92","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.166_1648700804717_0.4159009789905206","host":"s3://npm-registry-packages"}},"2.46.167":{"name":"@apollosproject/ui-onboarding","version":"2.46.167","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.167","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"13cbb7994b498e12f031838516ed4fe2f0449b72","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.167.tgz","fileCount":87,"integrity":"sha512-PL/Cw9dJ6nmTsKBdrnC5kCS6p/++6ZRdirTJKKdTP0lVYzYuzTsrZwqYlpueNUpOzO3rUxK9qp/n4zOOUzm/GQ==","signatures":[{"sig":"MEUCIEXetboxNgKKzOAsvGGTQc3TTBcI8deO4kMCmQhp8KsUAiEA8zyVadJj6SPU0YFDGSK4xu9O1P4lA8rq3+Jrvjjn68g=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":957365,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRS4nACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmowJQ//SNfNrs5sIMOQmeGJT+Mt1XgwWaci0TuKUbtup5TWZkI5yghu\r\nsLPLzo2DLDzCM4vX1A011ELadyPI2lT/LkWwbBh7Jtnn0LGtijNMy9f7+h1k\r\njnKgOqZLzAJM+gmUrua4wG8avmpfny7scaLM83NOW6JN8CFroGmUCqoTVToI\r\n0nwkuNsqP7MYEtcYGGcTV05284SCX7+V6ZlgP2MU2qmQYoIAR6/zf4vBq7hb\r\nfM78dnlgRZDWDXAWdCiPE7Def7n+/zZsPwmoVgwihDyMOO/zd/jbu0YweDK2\r\nss9P/nBppOuwPO+DpXGnCjiIlEFLmRlrna0ure/oyA3dDzXLSYUQpJ4Z4U/I\r\ncEneH82KwivdwAD7XaUmDyAJCHSpAOfHB3/bsIgUyeDSuUkDMst0IL8htO18\r\nLBjM9veZydbhERhDpG3c09eXlsmMx9cgu0ddP750Wm/6v5qyytRU2DCTnqXZ\r\nVA/dJ2Aoh70WDjvWsTYOhi07xZjh/nI6faZC4vz1rkv3PGyB8/qPTdqpHYLP\r\nY70Z8FvoPIvB3BxPj05ynNt/CHLNtkNI1tILjFHPFieYNAFZYVNs4Eg6+Ndt\r\nKBxNFXZ4b/3nonQmrf4r6Jz96ViEjhjMHrA6byWJCDLqg0IfDx3fZ/0ku2W9\r\nq2k8cPxrT1CZtTrptY7gfgRaUe94T0e4XIE=\r\n=hf9e\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"502676b403454c64d60093d375b6fd0ebad932f1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.167_1648700967131_0.408750016316326","host":"s3://npm-registry-packages"}},"2.46.168":{"name":"@apollosproject/ui-onboarding","version":"2.46.168","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.168","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"db484b9b0013810c06a61f3b91b85b9ed2c44494","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.168.tgz","fileCount":87,"integrity":"sha512-Ht5MniQEONVhSZQ4mPG2WyuLORg3Q/UeFvxgRL6xLDY92BiLQqyu+W0DGnjW50qCFlPDZGcQO8khlaTSCI12vA==","signatures":[{"sig":"MEUCIEhC9p+UzJhph+UhJiUfD8kCujsr4aRyi8rMXo6WVc6EAiEAwo722HEdZj5Vzu+UqHpkdHM4GUOo0H3xKakNThuRZr8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":957547,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRS73ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoLQBAAlWMJryVl2C+EQhSm7okpb653QrWmdMck+mvgd7p3AaJxaMVW\r\n/2nOw7dYXpiwrBUTIo3az0mMFAjNRnnKlSpsKN8axiwFfSN+tAIyEg/jJ1h3\r\n/8kMCX9NmhWu8SmAoDdhT9F9IomyGwG4LurNWlm0nMpqpuXwMXvOo9ESc1pe\r\nlwCRN7LPMTEZc1rxRbvnwmppAfxjBsHx+MLqay1aqxieL2VARnYQpIhIy0U3\r\nwqODXwidcZ1y6lubV4VWPVUK/ulkr2ETdam6CFVsOkNTkq3k5AM/2KEkVMMY\r\noTJPrvrILMZT1pZWuAWdu+9A+Hw8GeOfdG18U11SsHvHtUmfAYlQvqxdo+64\r\nADDuQ5d9hETPiB203W2GSqi5rCFyFgM85gHFq3rrJ5X/J6bFqqhXkPrdMkGm\r\nXGxi76qU/XwSASewjTf8o0JbGum18bu+TzJcGWpbmBbl/kikvXdZnKuA7JDJ\r\ngnr3Djs5jjw++uP1qV/+PdsT2CZmvgL/WO03XVTaW9GR324kESl4dENZ8Azi\r\nw3OR6t2NPFZR3kbAD+uULeATr1vl98fOaxy/Aq7MsmvG9Lean+QwsKBoQbbp\r\ndJMXEfpFxf+nXQrB6Jds5Zhsc1lLRmBBYcymkE+ETl8hxLqigd2QF8ohW0Zi\r\n74aBCGTe2HYKkOtKUiySVeBq4OaFGbDpUDE=\r\n=Qv5F\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"5077c01bd36be58f9d6e569886b8684583bb3a21","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.168_1648701175071_0.20399673080273395","host":"s3://npm-registry-packages"}},"2.46.169":{"name":"@apollosproject/ui-onboarding","version":"2.46.169","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.169","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b816b74b8c4e0c00e1806ac7e79c8fdacd1bab73","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.169.tgz","fileCount":87,"integrity":"sha512-2hXitMpSJpk7eCCRxpo3jtUdFeTxNcLIbIRmb5OprYhiki3RQuSVvr/7YtfW5x9MxldJ1uZjy5BKzRKwRRluIA==","signatures":[{"sig":"MEUCIQCMDKZHtVAJrequU5FJKRnJBFdw/POf8FdMaoplw0BDWwIgWaptn2OsRrDdAzk2WAgQq+Hd8G21j333IjEpMg1/jhU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":957729,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRS+SACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpXRw/+If1TMSkCNEiMWIJr8bFzU6qBspjtuaXzeW3HMIXQpykFcnki\r\nUtAnYEl+3ZvwwU9Fl/nqnzQJEg614vCRnxgqoDB42PEXorQpVOo1msWzLbR7\r\nAU+lsdJkCgtxOVlkQN71w5bMMroyrf8oTNB/Na/kjY7W0ljTeynyqy+qmUED\r\nBncNA+HGveE+bS+/WHsOZMdi1vlm2mxobVMItqB58m7eACMcHq3ApgdLev2m\r\nrmPECCpHMfZpBDp/K99x8kqNKMKTbm16CWvPfEM4RgMqW3f2ucEhCR7gGt9A\r\nbV+ehipDqRye5F80u4vpruQC8tUOSKDDG9mkDuxYNjkC5LnZy0RaF594qacG\r\ngJ8uPFgFDqww5zBav+1KuVjaSKT7ToGLpchrT9Px8sXx+7Qb7LJxYkefcc6Q\r\nyTQXnOpnERReOIrzIE7dOWpNRm1o8Yjxt5HqxXHAO9g73/JiUBYpe208Ya23\r\npEvSutvkloEezTJNmGHl71RTlvXRKL1MQAwue8t5h1YVqB9EEOnZb6B1oEfY\r\nYdY/6BExnBeVGi3SzLsIqcy1BINBjJFYaSX2nU2xWGuIwpdnmsza5SNc6VdW\r\ndupBVCw8yyh2+Rm4axhVaa+tIuerzJJcdVY7dnSnPeRt2l4Ol9PwtiS9WTYK\r\nVs0BTRofmEyERAQf0v991pIkwvgdxZVqs+k=\r\n=qtkl\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"3c377f8656f66cdb1aa8fe0d67bb14ef46f8af24","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.169_1648701330513_0.49016287793228996","host":"s3://npm-registry-packages"}},"2.46.170":{"name":"@apollosproject/ui-onboarding","version":"2.46.170","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.170","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"028573a2a97cb9db282f738eac1c34a0b423ee34","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.170.tgz","fileCount":87,"integrity":"sha512-NdHUStifJhUAosUY2PmvQ6d14jdcUE7AjOAS5dGIk+baf9aZY7o3e45nT1CXM9cWhOHQz9f+9/fs91DGSoFpCQ==","signatures":[{"sig":"MEUCIEQ/JZ7zqi9GhVfdBUl5rNuBPC/R54q8qT53i0risTuhAiEAiHFGxd3GhTVjqaWqgHw4mx7PvomgJDqxGfVIGoc9Ae0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":957911,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTBGACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq4bg//auDShd0URg1aCxN84Oe9eW5IOUoMojaNYbfC2b+oScw97Yyo\r\n90eUI7jkuA8TDVdqZWhAMfFnqrsI9EO9IfTEOampdUtd2v7AfMoKnh0FVxaV\r\nFX6+GxuIFGnp+Qe/CyZd4rmOweF2yQk5d6/C0mBALp0GL1Y8G1UqwHSlXTbP\r\nzBOnDpg/lje8K02ROm/48iPnCVMd+jB0oTGtSyKTA4SJ+HTro6OAYOgY+GXa\r\nf5v8NcUJg5fPAwMPfVgEw52UZYd7Qrgn9O9Gz9yC9IJvyvaVN5Au/ebk6TBz\r\n5EPx7W6iw/TSdci9jSf2oTq5MT55ZNYSxsWV+q/7VjlWSlnl2lLvn1NwBM9Y\r\n4T5catUIikGlEulY8OAdfYDSGmRh9B3ibPU9/Ipk3RW6WRCQydZ9Sj1ltn8T\r\n1yN2pnVRa2MeSUjfRvzya/hEpnt3OjVZ/Feeh6XkM7fgDrCV7dwLvYHIMRx6\r\nXolaJIFFqPYdDHOZjNWDkYm+J8P7aJYn+giAdlt9vJquFqOGFwuDT/3lphGz\r\nXNOrbnB+sH/tYbRDwlp/aSFNxhfxD7dHy+rKFBoxtePJB3fIEYmk8OZot60f\r\nvL6VfUQx8cggw8sXIxCjZvpzu47Idc36NCSwyeLIEm6IqzsDY7U61COnJJlK\r\nzvBH19SkO4KtqJ8LSKaVMOHa9hAUG0ZDrt4=\r\n=TrcT\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"1f219b74183b511b2b7b54b04f033ae12ef186d2","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.170_1648701510451_0.4052941279154052","host":"s3://npm-registry-packages"}},"2.46.171":{"name":"@apollosproject/ui-onboarding","version":"2.46.171","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.171","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7705b05d22d9705d17111afd553a8672fcd71bc1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.171.tgz","fileCount":87,"integrity":"sha512-fBwDRo38iwjyCQrMZIZvaxC+Nq5ne62De79YBcbUTXoJluzFmVl9BRv1ZbxBQXouYUKcjrDYQvBlLdvdHObPlQ==","signatures":[{"sig":"MEQCIG5pVeZJQJsUOGRMssvUbWbo5bhZlpjGOXwAiI66OKTzAiBCbtpG91f53JRjiCVVsDf+SsjQbgu54XpcOT649DCtHQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":958093,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTDuACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqjNxAAib3AVhPf+MOtCA26EMLV0uUW4qbXJntuukNRpCnufmG6KqHa\r\nbLvJy5wCKp84JeJiGVDvdZ8tI13Oqj3+UHuRHeQLJsgihDTvcb5+/m+ZT+Ek\r\nZgxgGogEBfGuyl8YQTTTVeOyC5G4/JpRbbwWIRkuQpXxTDBwnuwT/7J/BaKo\r\nT7Ce1h9/EYcgvd5P/YUY/4Oey5CMTvihjVMX+pLMlII4YITlDPeB7FX2SoRY\r\n9n1SSPCLsyZbjXTcaxSyved/BDYh5YdscN8aX3L/PmLIID7l3PXjiZO/wYvg\r\nWpNt+EbkscxWx+NsNMaWFKhT/HQXJAsK91BG/T765wsxGqTBRSb7XaqBDzUr\r\nTklQ4JDpsGGUJCuny2fazMVaNQdH07Xx7RbGQTbmok1qlPuMNOCSRrJhMyfB\r\neophrrkDnk6nxOrZYftabn8myxsIIEol03yeK0wv0Bz8dRqbKi7nmqbiHqb3\r\nDz3G2/V3XGkqOOB7n3p2NreliySvhHm42WaRcb+a19DrQ50aLMGJzoD+Y1dP\r\nVl2nWLEw/b1wEjOzvUk4HmPsdlPdVJRXSq8CjLg+rAAnDtLrddqgC8C2SMi2\r\nAYEzgf3gNQ9N+SspxT6gSO3RYBUxn1ThOJYzHdge0kRo3LKioGfdrIYGCEmz\r\nc1gxu0X/vdB6lY3+RE+enyU6YIzj5noKagU=\r\n=J0bF\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"412a1c164c0d6402afe5bfbcb7335904c1909582","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.171_1648701678145_0.7408875724111899","host":"s3://npm-registry-packages"}},"2.46.172":{"name":"@apollosproject/ui-onboarding","version":"2.46.172","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.172","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"13fa56310db7102274a0f1b5b3e2739b0a8cd55c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.172.tgz","fileCount":87,"integrity":"sha512-FGE2D3a5cHN0yatKCZPNdX8EaYWD5qRK7Qxu7d+8nnN4MOel07Un+U6HXZ/IO28AyafBzRhc0eN7yJaHuzTSKw==","signatures":[{"sig":"MEQCICm2wl+mHVYK66Unjsc7xKjwZCgHelx5dTlNKHXcUegrAiA8lO/j8tjo8bh3C8RgOFl35Dcqac/kcCMGyzV+uxTiJA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":958275,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTHkACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqk0A//S7lMNFn1RFccOiBGBIib5mu17peNrhHqu4N3d8b2ZVKEQLvJ\r\ndYc+umQlCzIUDjIeKMf0wL8KQv1GBoR2rKDc/flEaMRITmLqT4VE226t8/rr\r\nEMOQxsMMI+ZV+WmKsVYhbVu4qZxd2rD2AmKmtMf8TUqExc2vLXWJKyM9FYs2\r\npjaEd5P7r8j6DJWz48Q7QJPXKEOLwayDQR271guJh3ROLkWTTWSBlf759hwU\r\ntqhnIzKNyOfSuDDpP4wwcSH9qzsh1uviLS1bZoAjOjPaanSTRwcmomcBB1v1\r\ncIPcQJaILuU8ZhcOCVJfYulXJgvhyfQXYxsRUE2QAiimPnAYIBTZuqSjT8Xk\r\n5aXeesfntN426000E+xw09niEMBTkojX0f3Hg5j8DwrCYXg1reXdQdi5I/ML\r\nrqu73j2nH4RY5Ke1et5JF5HnwmWC7haZO2LIFoA7aKgoPeuOqhA8ZplZvLbh\r\n7eDpiygnT5DM7e6rPQ/v4eXuiDFMlzVaYvtBKTk/8bZDCzMkBwhhh4zzYcg/\r\nq4CrCJ3oncPxZTQ4EswqdY/Sh592nD8QnqSPNlrzWhQbHAAwVyVt8j3rsRTe\r\n42nIyL4GpbVTBm5l1uPvSsxzI8+7TkOt6y3UTznzjfyrP7jndkYpHor9mpVy\r\n/YObZ22k3KkSIBwW1S55l3y+DZXI7c9nDyU=\r\n=X9yF\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"bd29d663ec91ce2c1fa6b39dc1562bff0767b1d6","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.172_1648701923926_0.5564359215677501","host":"s3://npm-registry-packages"}},"2.46.173":{"name":"@apollosproject/ui-onboarding","version":"2.46.173","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.173","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d8b9d05fc223592be83ecf2fa2062c5ba0c186f1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.173.tgz","fileCount":87,"integrity":"sha512-/m5vnkfEzQ2e2vpwZGdkHea8LSDwVpY+BudrnDE4i+MRjWiyGXRnUhI2K4IYXvLn7cdxHAfR8+YbSuqnDHO7MQ==","signatures":[{"sig":"MEUCIHLtQdwDNNuuKIwK08HlDrXq6uVRc41nIN7IiZCxF0mzAiEAsi0wHA2eF7v8X6TjVlGt8NldBeK4FfcIjls2otluOGM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":958457,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTKYACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmrxng/8C4/goP/ByDI/3+4Sa0jm/kbX4UN4I5rUCQS1TNLf2uJzmD6F\r\n2w4bLqAipXdLRw00231OqeatKiMbE4f1IkAWasOz2Zu4Lc7/tL1UOcRyxDQD\r\nd+Ha8bBZXP2LGEgfgG1SQo+npCFBk93bYmQ9y2TfVxXwBsdqjv0dArVGLIAy\r\nD06ngiWWmnOeCN4WmDb2GwQz2/NEiiEq+Ggz9w5N4W3w4DuBViDWJt7XhvVQ\r\nVTkAmSSeOZ6V8hT1M4G9DYrIC5A3JOC0Xshnatmfyvf2DsltC/+5asLDhvdU\r\nt76YoCLThNOU7PchX3yjeT2dfPBkXFZSgApbftLTylpGSVtGeqYGB9abqTRJ\r\nzZpWtS0MqkNUtHek7SF++Du0Olo/hbO3B6LHGX3Amo9EIrei/H73m3MRzu4j\r\nKh42PSzCix7TsaEDrasjCwwvLYwn2GJ55bYyleHgmz5p5hmyljv50xslbwQl\r\negLWvabvfMEKupSa0BKgzfPIQb347DSZFgFX2CSSaCAOcwr5FjP1bVlJut9j\r\nvnafd5RUfZkXCRIAREMpqKG3vp2Bgz6Pr96MN0Vaaclh8wq6gHxuB6gyPKwA\r\nmJm5bPG50394ucXUp8p2bbWCt+w8EIb0KVXDNSM111BESmsYm9KjYAmAlv2g\r\nPcm2J7nsVq7vibQqi+2uO7REkYWXVt+DnJM=\r\n=WuYT\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"92610ad8d891d78f50bf251926e897f7a9be6634","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.173_1648702103988_0.1311984642514641","host":"s3://npm-registry-packages"}},"2.46.174":{"name":"@apollosproject/ui-onboarding","version":"2.46.174","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.174","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"29704e4730741e9dcb00af69a932b7c77846e714","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.174.tgz","fileCount":87,"integrity":"sha512-Ip2fo/kFEEzRugRISz2JMqGeDO6PfGGhka7S/RpOL5fLZkztwiGscv69srS3Up6cMPxy1DZqHIdAAXicqxJ/YA==","signatures":[{"sig":"MEUCIC+MekcG8RpzKEUetteu1HJdGTJzCv3AR3L/gxxMAIm6AiEAqZgq8addComXgBVkC6trjit5kOuzFAFI3/pc44Zry8M=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":958639,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTNnACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpaxw/+Pia6kdZKh28FLUGj4x/assYvztaMnNPR3DU846WydXUy6rRk\r\n01Fv0Hm1Uq6Va7jx3f4oIQGK9zBiDGvQMRgJFp23QHPf4JVh+ERVa8TtpYNB\r\nHbTn0zSfLwPdiUgjtOsYvdCAjBEdtpKRLhPA2HXwYHZav4+Amwgyg3HTyEKa\r\nCb9/SfNK4M/yLsxzMPnzarmrG0VvEfiUP4vd6eMUFePb3t/YsWgNgBcjM5Tl\r\nzXIiiW7+vqDWY03zcaSmAwr/iwytKphNoEwJHtedbF+e5Nw0DrNLS7HVJgVa\r\npUQkeuXaChxIwtB1AR+AqNAziS18VBk/rQmJq3/qHVRjP3JWmskJdZXYLDnN\r\nqio1b11kEs395+9licT7bK/SyfXUE+V1oaxXzJcP4ttHmZnogIwpRZOdAkOh\r\nyC9ecZ+HKqEcnbMwYQx2S4d9TdDgXSz/1HtVXR4H93dSOZLZBhmIe1VDZ5WS\r\nsnuNFm/Cb96kHlvu/scoXuLDt3zl2l7xRqKRDIZ/z2a/TGG48F9/2hHqJpSp\r\nEcgI9RnPZYVzhkunkpnf2qUCmwSoWgplbTiDuprSPncGCpDpAd4NB8Zx69VT\r\nv/kYUufiYir5Jnhs4tm7zE8VgaWPiIRzovidubi55QUJCbRZON6iQNZiQB3G\r\nj1QIU/o486d0mpncOvhHGI1PdbqKoH6ZvUU=\r\n=X69g\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"7e44c73ead4d42ce091c19deba82456633e222df","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.174_1648702311426_0.5799080925212032","host":"s3://npm-registry-packages"}},"2.46.175":{"name":"@apollosproject/ui-onboarding","version":"2.46.175","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.175","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"c2122da7d09383c49435702b803239f8f842208f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.175.tgz","fileCount":87,"integrity":"sha512-/0fV6dUhxNFpTwe3yAulc/CrnDEEJmBhwsxPeQmAhVREwo6N9pxZ7c2X02UycAD3OUevlaFIRQo3GiDIYyKyWQ==","signatures":[{"sig":"MEYCIQDA3qoDDRDGjsZCZxBwaW5AnFZD4UJB9Y/GBKM9ic/I/AIhAP/9fw0A8H5buKQNqMNXIHggyLnvmBHMWfbECv9Tab7J","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":958821,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTQiACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpmgQ/+P63wfnavBa0sgceaFlHNHYJ7S9PxZhZWv8z+cE19zErqUjHT\r\nxameyPbUa+fsq4LG0nKK7tMZ9X5+cW33R+IkZ5ySsF5MoMrjh0u9omtFQkdg\r\nHBuoLy3F60IZTKX39ZgiOE8SQLnbGRUY+f9xcXE7a//XUfpRcTa5AQO+6tG4\r\n5zo0DWgaUfjcM25P6iiHz+LAirASKJRrXwo4nrQdTgha7o9GvaqtbgMvwCO0\r\nr4KL91cIemHy8iMgVdytUvqtw/H/LPeiKc/ofP0T4D/7O8Gq024SurY6pRiD\r\ngjKB01Kz82v/PppCaOBLJLBD/CcIspelpWjmBnFDOcZdqAFFzqcVIkauXSO6\r\nTatVS87bVW5pnIn6gOZ4elZxDRpD89ZP8l6sx22wYZ1M/8PAGEQyD26IAZWr\r\n/yjwobGOXhZFTS9rsCERjN6OxmNmDhR31TbOUj3mtya4yf/dy7B+WK36Kgh5\r\n28+vbHmY5FZdzJt9FEl+Oxwi3Euou36TGrTr2JuP0giuVL9CyqDSm8+OBFXq\r\ndRJIFOoUBUVL8LZLwTeyW9ZutAegIcBYMXfJpRVU7jp1dQNu+VYA7ZB/YqpE\r\nOTmok/Fi5qqhUL2AFwQlkDYQt5RNckbzGVIzR510tRYwRmMxgMagH7NeikxD\r\n9JDc38WEjDZbRKi9vk74R+FjDoti6sUlPpc=\r\n=4gwO\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"62dc1eda03c493dd53d65479f60a3c28d31dc62e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.175_1648702498549_0.5606377582012525","host":"s3://npm-registry-packages"}},"2.46.176":{"name":"@apollosproject/ui-onboarding","version":"2.46.176","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.176","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"cc873d3f24cad15785f8afa24924edeb7eb2032b","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.176.tgz","fileCount":87,"integrity":"sha512-c5zCaZ21pElNEO12Y+ZHtXMJrjdcrAuEsqzDJmH2yOx7AyJNJ9LhOqXmYPB/tLIlZXxR7ENfN41sdPlj8WJKug==","signatures":[{"sig":"MEUCIQD5kihzPrseMSwZLHSREMxRfCr3aNvGQ2LXob0/y/tQEQIgTtlLvzmCf1hpB1YJJASNSpKzqNyX8BK/KX3N8eCk+gE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":959003,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTTWACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrpTxAAjuxahFZgRo+LjtYi8cZlmTNBesuHEdtKB0Xg2uOWRHsI7vNQ\r\nOQqYzxOIPPw8fXMlFcLHMbAgYu3iWFrsUWoWEk6t4pJRZOh4w8BHANJ3sHYY\r\n3iFhjSJSvxFWWCjZ/VkRZENcia0L8E5P0uREPfjwVjbX+9bq5G56Hb7uVjuX\r\nSCfu9W8xKbQ0NlMhd65yLrKvc5Je9nIlSLbR54wtxk+Jt8K00AKJlm+Sj1SK\r\nCRzZq+MSZBOXgSRcqLLTh5bj5U36qrqy79ZZAnP7WkgiJwQnFsOck76sGu2z\r\n+sDaviVhtPKOE1iShSG49h9lHi0M2QVkurHAYmoxSl/fieMjmUIutSQF0/KB\r\nQc6JtLjRUYtqpzmmyr/+N24bTzaLdfUx8asp53Bz2CtDuwluRrJ2vB/FKOhQ\r\nHmFjUd8/8MecAs1s8A7smy2RngoiqpXrZI9hX5IkYrtXdP9NTokFVIeM7GL1\r\niBgWxXMyuGt8aqc/AIhnvbLfS6FqHZaTUl0jHwUy556mpnMHBDnKBRfHVW51\r\ny0kKnqVnujJeCck84Hk7GiWQqSryvyW8+0fcD/D7+eLyRv1wwxSwsf572+oq\r\nFI0FqRSD6kOcTlCYFqZI2g+h3Pq6xaPK6ewgN2V2aaa4LiQgasOGr1rfs6ll\r\n+kvyR2x2LJrbHd2ZlI67yRMT7tQkrIsQjBw=\r\n=xaKq\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"f445a837b1b177aa3dd0e5f26bd2d16aa3cc8845","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.176_1648702678555_0.4048800964772423","host":"s3://npm-registry-packages"}},"2.46.177":{"name":"@apollosproject/ui-onboarding","version":"2.46.177","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.177","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4f72a47d16b388e510f68a522bf39b2428f85f06","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.177.tgz","fileCount":87,"integrity":"sha512-n9zbflxN6C71u4grPhtsArV7cY6+CQ9HtycgCGbHGHxR6KpkOUKC572Sa/oUimTR76LqqAtuEEfpYJtrJv4SDg==","signatures":[{"sig":"MEQCIDk+rGDlc0IXzw2V01sYuz81fxo09w1fbLaZjIqBbmzuAiAbebnCqXs0qWB0DK/BZ0v4PDm4BArUVHiUCFEaYzLfvQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":959185,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTWCACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmruqQ//eheL+h/o60VALo/9n2c4fjdciDKQ2xaL/iMPk9k6fPLLEDWz\r\nXhAGsQh6486RkspC8h2MC+UYAwMTFb73OBRbH9i+mGgribGhPdExBiQItPdd\r\nEI3WrFq8W7QDAZwp+Gxb1dIsZHMlLJi40ga2cST3AgqxsCKFZFygDLxSeJYn\r\nvKgvEzptNlOEhT9Z9uXo4nySrTqjAmYNg1Af19BGgwds3LwRkP25MCnyhMdo\r\nOh+OjKlIXdvKcge/bHjJqXi2flDStyA6/2UWeCIg813taipQe5goYsMHQSwJ\r\nfuABGCp0oQzqYGnw0lnAO1OG84W2NBWxIKMOutIV9u3o7n0UFsoZ1MvgCR6N\r\nPapmBB+WFOlez/Cva3q8kkMcMvrd6QaAywTt8X/2RSg4KA8ev/QlFC1hqRK5\r\npuSfvU9H0hpq3tX1ma3jpjgyNFrx3SppiWgaUA7VtmzK7mf9f03soXjlxSWv\r\nHqyjNM25NhAvMbugtqDdw7Ps2R9srmzUlWFzeCPKam+Q90rw6l/9fyuS6PhO\r\nRTwBLvLISxM/PAAtPUqFaWesyg1S/wDzgV9xlqnA5Pmtzhs7gno5xa+xdh+e\r\ntZBk1pJfsXjBA9VJmCJR8IE6yXR1UZzMWOqIrqb0omSPj/7FKamxHGT0JQab\r\nSktPG/M85ArmmM2dv1jLwk2RdgQpHRQEpQc=\r\n=dpAL\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"cda5828d5e92c136e2ef0f330e1d4789215c1fc1","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.177_1648702850624_0.13897128258439584","host":"s3://npm-registry-packages"}},"2.46.178":{"name":"@apollosproject/ui-onboarding","version":"2.46.178","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.178","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4ce79e8a916c24a5c9d00942ebe9083c68f99813","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.178.tgz","fileCount":87,"integrity":"sha512-mraOCrP6UWb1zxnWDVS+LINe+75yOudnwmRcLnKboH/6UiuAEXMhHlGyz5+zT+XLxnMj9YozA6XBzrJR1E2nIg==","signatures":[{"sig":"MEUCIA5rClYUJXeTpyfz+ahdzMY8CA3RsbKKqymu0zfr2N6mAiEAyH7Rgi9a8AZ+Fe8KQYw7wo0J9IsgBq+b6umbMsgwroY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":959367,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTZAACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmouPRAAjeFhWvi4S7ukvtX4aAFRLTRoKiuIGSkf5OGKO/PVwrTlGRWY\r\nGgvK2JEoBUU0WAg88VLHoVwhjBsW00N+0qfO7c2tysRFb2l3jBUGm31lYW8b\r\nJJyr2CgNyWjLIQyQ/SmZK8ZXWLn4SmLQvmTaUt+XIEWcaMIe85fuNObXvuM7\r\n1+YDlV4sWWVDWprv9jIy4UyCp5misLFeRuSMgvCmp4Ri6sB82rBSMIc6qfmL\r\n1wAb7/jGMfPYee0iGRqTuyw/ErkkCWRaAhB9tRJMWxQ0rk6qftrwb9wDtlIR\r\n6c0CVq983IM7wpP+AXZFs8CLnxU3UFH7uOr6jTE1ftr7j8NcFyaeqWRr1e6M\r\njKl+JB5xRnmHpLXzlVUyDe926EdIDSDIiETxWqTapMCig7yP6AlGqaLtMHer\r\n8QRknxOCVmIcyQwHENisrvcdGwy1Zp5SkBroW6O6QpClHJz0drkdun08fWfj\r\nns/Q7ixutUztZdTRaFCaUq8ZbEpelGASJdN3PKqb9ZzkItFBQ8ey+9OWEmsG\r\nIOfpNvwIhtgzuWIJlfZovwiCBX6WZizr7ce8LIi/3czDcEPnS3BWoAW8z2II\r\nmf+qohhKTdULuWbM0rbKHY9kMn9Ko6LebE7wU2jc3UJ91LluT/MPvzHXXkQf\r\n3Q0dmWRDnsO24Ea0QFtFEzh3uRL2IeJpmdA=\r\n=blGN\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"f1e682d61c9eb0a84ff9769bbc376cdb8288fda8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.178_1648703040125_0.5678508469326105","host":"s3://npm-registry-packages"}},"2.46.179":{"name":"@apollosproject/ui-onboarding","version":"2.46.179","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.179","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b625f3e43a80b63be9157e81446fd61027cd13cb","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.179.tgz","fileCount":87,"integrity":"sha512-m4CzijXrcC7vTXxmfqf4uIcl7s/f43A/Kn2SgrDia/N/edNiGIe8SkJo4enYs+NyYuJnZy+zpnLB1pS/uNfEfw==","signatures":[{"sig":"MEUCIQDFlCHV+DRscctqFbBWE8v3kt3cWspWM07ZS99VWYUQIwIgYW8b/r9O6FjHx9zPvjPzvaUWE+JMEOQsvCJzh/H2Xp4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":959549,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTcaACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqQiw//c58uTK0PHScQkFQGA7qXBXvNZXwaF7CP1PCMVBLcDFjIg26u\r\ncaQDpHdc4rsDRw7FWWhpNU7aEpzJm0ojQPWem5phbMLU+qMYlt3jTKDrJX+D\r\nX9CiI3NfGH7M8oFyUmVd8DauodSj/3vJn6ETQmz2LnejYsive8C8Y3dTpj0J\r\nrhwwvzk7++YQ5D+QYJZXR2ZFQ1ZMy0JIKJOxuNmGUNlYtxg1E+lnpc1+XcuR\r\nNPsPw9j0uwI8W46COP4kCt1OFY0mpJgC26EkORz5Bk3Kjnw2nV8qnCxt+K/q\r\neOxJsVAhlORDcnQlEdA9vuW34aXsd+fZmHtc9TDjMgir7qkumo/IXuJOUdL2\r\ntkHUDtuWCVf6q3HDpCax8DSDLX/oUgbQji4gbESRmSbng2fQHQLxTx/hIVzq\r\nJ1lTbTaPzJK5RzV1+bs11JXHykJJRKSPMLt6iTnAr1z3d23SRi2CQopVErfF\r\n114nQ4RjU6zp3tiIQVmjkevZmxCLwzvKx4PdiK59gvcnBCDWGc300lsbVtlx\r\nxqOPSiWnGN56syESLVDfeIjUDV2rTc13099yu3qCa2L4qcfQiEa/4XyKBCUJ\r\nby75C7HjMRpFzFQrBpwpYS/99/cn/5a4U6k5yc3MzaKptv8XWOo5A4BJjD8N\r\nLMlZiufSk9QslOgSkfQ2Dz72uPfqkOy11mg=\r\n=Gzfg\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"b6e9a3d9bdfd821f305fe51dc64660562a59371e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.179_1648703258120_0.7468673357472064","host":"s3://npm-registry-packages"}},"2.46.180":{"name":"@apollosproject/ui-onboarding","version":"2.46.180","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.180","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1b0e4c463800e17f2872634582f6047c23b1f16a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.180.tgz","fileCount":87,"integrity":"sha512-58/s0iieW39Sj+TvAbXXkTyG6/DmOHRglfwSETcMnVPcZ+uvjRh0tNSD4LO+XOqc0hqJXLh8UlZETuEHsAdDPg==","signatures":[{"sig":"MEQCIHfD+t1JXA/cfuHKFsqqLSor87lniA0BT3DklOSvP6gDAiAOHbUKjHC1Ylize65bJQcQx8C02i1qEjc5/Soer2PIkg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":959731,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTgHACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmoz0g//Son6RWaV+bA82pB8yS+uEaKwkjNxdXIZ5cnEkRQBuJU2Pm7s\r\nXLgcGm8WJf8kLhm2umMkNkpw3zWpwfgRo2H2+SOVVyJlnwUHVG+J+PiYo20K\r\nNaCrBeDgGyrWiJJ56kTNiQqQbR4ycNhbQhqxz65bmUbCo8jBrzZBOydF8r8G\r\nTGG4QC0SRcdJ5+csb44ntjk835oTLYJCk4p8v9yymoQtyhgS7u4xLVRahfAj\r\nRGqLrQ0SZjDJGWK4ELt8SUPlo80QUQ/ZaQ2zLKgIJNo01XKGjyY9J9fK4XjN\r\nhV0TlrhCNBBF86VpvRTbhJ25IH0vjnT1wVtu8H2oO1w58+0LcjLrpoGyVb60\r\nxTLjKkDX6IZ6VtuyyHV7GcFdY1u04HqO5mkNoXuB3IYH4861r4wo4Gkd8X9J\r\nv8ym2exBGu/ligrmsSDsvBK27GI/JREIcGOWVKl1aGLT5uxcl0iOP0srhxtr\r\n3TdCw2VdGVlHfchKeCcj/vCLC2ggLssT2bR7oh4fDpfPojhALLLDYwqdy4tY\r\nFNMW9huYXGX8wd9R530DTH1TvZG7ri9rlzu5ejc/JUm+SUo19ZWuTh28Zy9Q\r\nHEmSPE70ZoMPi3bcjNTcEW0IO5J3onLo0wcsp6bQ5soDdcwExSpJSWtg8q9s\r\n6Nk94+qZnLfMpnuO2kzY2fi+tKin3IXmnpM=\r\n=TBDM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"8bfad9951a9bfe6521bc982f6d1d813c5b97eb84","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.180_1648703495542_0.3715337479898255","host":"s3://npm-registry-packages"}},"2.46.181":{"name":"@apollosproject/ui-onboarding","version":"2.46.181","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.181","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5050c603bd76836bf331bbf70e6f020b98a4b72a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.181.tgz","fileCount":87,"integrity":"sha512-LDBoepVw8nrk7YGQ8X5EAap/+Rd3zN0tAw5Dr3ahAfj6xy3vQ2fOxzYxicEloBnpZXvguJrDb/A0rdzgmO2Nnw==","signatures":[{"sig":"MEYCIQDMpvGSMUrVM9LmUhybbp9yqgmKC8V2/Odu2t96/UWWQgIhAIFOKJ44H4BtYAfZ6DOm4u0jtJ8CgOBnJUdmHqdZiD5G","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":959913,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTi5ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpDCw/+KVR7D8vFBMpQHI7BYpi+31Bqrag082YqXei+TnQaSMNk6JTc\r\nmCoT85hUjrG3CYWbGYRBe8MqtYCQZypAHUzjbcp5syhsDnSqglS6riy6fUXi\r\nssqWA0lB2JJ0DH4nK1M6KUjzAKsZrTau96GFf86zL3Yrcwv4yjWXna+1IhI3\r\nqk+PDqCq2brdeTE++EE2TcUMp8TujAOIo1aP0OF7Fw9ZbjhSbNXVwuAcCd+D\r\nL9wNPUOS97R9m89qhHnUGWJM8cZ4rep5UUm+PhKky3hLksmg+hQvBvkxPYIU\r\nDc9Iantj8ONdYG9wXl9OL6T4j7f9yJp9WBjFpzDK8xRrii/CGmIvKl/izvAV\r\nAxq7jDJbfas7Bd1xPYKNdmqzzqOY2Dm5FmmKdNJYlf1yiTB4rMuqHbZkXYJW\r\n800dyVR3I1Sgj5RgIIceHbJMPXB9hLydOa4fQ/8RooD+pJIZXH2fxd0ohXeO\r\nCGhbEXcDI75JTTvJZ0NBOCx+sxcP2MnptE5NKf6rJwpk1QJqd8s2w+IGRNE6\r\nDopmnVzcbCfor/XX9cJE4ZCHy3ZR2x7y5PSyZDAeaySFk5CmqTF5st9CJh+K\r\n+4xRSYfz/BDx+NkZ/6XZJJWCH6VSqOnoO3hXHkGhunYi6VFbKqmle2wYow6i\r\nk3P78yI7TDyejQJ7nhhNjcw4wpLXFxcLwvQ=\r\n=UIk9\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"29c26de92452f7c96ad8b8ce764e9f823d9f8d32","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.181_1648703673719_0.6809206138953614","host":"s3://npm-registry-packages"}},"2.46.182":{"name":"@apollosproject/ui-onboarding","version":"2.46.182","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.182","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6c00dd3cc35d6126be62390c29d9825771eda08c","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.182.tgz","fileCount":87,"integrity":"sha512-uNarlKovwuDrcaUjoL/EYamTIvp7EcJck1iPNfRHWJ6gNCPGnItn3UDvM4dV6R/mES9r1M20okCO9Q8KS93Bsg==","signatures":[{"sig":"MEYCIQDPqB7BWLydAdGu9e0Rju84Cca4M1hKNlpmO1GC0T2pswIhALES1Egjaf+pTWSX6N1UrRZfmWf5mqeYvNtqqV7XUn7X","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":960095,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTl2ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq05Q/9HEN7Ic4P/5a7PXSPA07Tmez9KefxK7U7r/14Omo2eBorSFtk\r\n3likq7rcdbeA4zbYgPLs6TVX1frIro8WWUXp/2a3nF4MNS+sCLjm3PdF5dJO\r\n+QEUBJtbbuhwMIs4Pw4/oaF6lNylniq01EZhD+PaALm5jQYhl/JisU+cNOfp\r\nOBmBKqK7s1hJ/bI04kssymrWWkpbiW0p9U5o35tXFITack3bTEEantUjxHGf\r\nIpMjMJ2kRjjMu12XewLRKEt7r7ji60dcYPKXNzW2aomoQfqi6OQwuGrrMNlw\r\nBbJuccV4Eziw9LswNoH7kSNqhAQDHKSC5xoLCe98+wR6xBmqnURWfaayRsUu\r\nFzxO0MJ2CbpLUYcwWWumHM0vo4W/ki5c++0x+cpvwId7VmwMLHclXjtePTZL\r\nCVCe3v5u3JOV7OrmFZspecIzmeewjO3V+idFssrJngAmFKEEa2lJHW9nc7M5\r\nnoXe2jTFvuxCedVZU1b9euDEmdFyhPN1s4I1969NTLmstcGy5UMXcOgRQwNK\r\nmSJIwL30mxApPuvu9qSSMYwyfG9fmh4VAL4wrBmNihlQEwZJwkKKMNC1/gMS\r\nztOevhY9+ObmMrSwBOCKQyqRLAtEGwLKuoToTaTrf+l7q5yA4xBkLNw1lkML\r\nOb6KWJhwapEqeS5jCoTDonDl/Ahbc4/vUIg=\r\n=qSTF\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"207014595d071f7ce424ec739fbea8ec2daa0379","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.182_1648703862352_0.25887746112610177","host":"s3://npm-registry-packages"}},"2.46.183":{"name":"@apollosproject/ui-onboarding","version":"2.46.183","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.183","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"78b25e7b7b85d62b6fef0fcef19eba853325a758","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.183.tgz","fileCount":87,"integrity":"sha512-ipcnjii9SkkzjeZmWOCcEgMvk04fF/20rOIK8hMYCCSOw8KEui8IysUGU7mrFewwtl1Sx72sR44kV/XCkYQs7w==","signatures":[{"sig":"MEUCIQD5i/wQFTPRyx5YEAZxZHAsmUqiOKEal0rcthK/8Ap8uwIgPtLmiHrpjaltyeHlEczw/C/V0tZ1N4EPtl81isrDoHU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":960277,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRToIACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrvjhAAkSuSPJoUl/VMC926EIoEoPCa5NQD0bSlM5fpt7H0cdGz35Cu\r\nsPGM1A3FORfixgBsiutSjtkuCCAz5BGViY7vtil4nbQMdz1b8RnSkvppTpZP\r\nJndnF3HCkZkp4ZCi4ZIwZf5hwXnP0qe1lFO69fmuVEBd0Snc4iqtCAiyJgmz\r\nTSbECK0nNASFwb5sg/m5aHynMpuhrWEdH9fWfkkrN4x6Pty5VVZjY++MCwW5\r\nTofzoeiK1cuTW9qwMn9KLaOKq0kmSnd02IkOxHYu7uORFIeUTBx9zDDXHZ0J\r\nAN6VZfZ30kcavFNCbr65HYBvJxCG8yXkmTl2zXVZMcG3v1aE3cEI4eXxKwRq\r\nfGbtSRvv7z/DEjgD8pDzv0CyCyA3VsmLp4wriI6OHVvWvfXj6ttYY3cpv3Lb\r\ncuztae+R79uUQpUz7oXUlRl60PH6f4jhiKvYzxt9eD9sOj4Wo/Q8FKzeLX/d\r\nL4o+tty2wzNSNsFYEUP+zfsKrp+TmJGM39U6z4anMn5HLG1fkkDTv6MG6gSM\r\nbrxYU/g9iC7nvLdPvQz79pTynOZGDq4IoD6G2dA62ph54cKy0O2M3d2xdiW+\r\nKnzjAgruNtnDxdFSJ1BMVIaoLZWtYxyRqIDRHr51OR1KN/xxjTxxRYHXhsaR\r\nIaYOkfzq2XC0ovbjiIwiBQmyfy1G0ntnO4U=\r\n=bA8y\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"3b433f03e166271b128aba5845fefba1a0165de0","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.183_1648704008753_0.39267145943045767","host":"s3://npm-registry-packages"}},"2.46.184":{"name":"@apollosproject/ui-onboarding","version":"2.46.184","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.184","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"bd77276133c0a47790d150701c855113860d6bc4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.184.tgz","fileCount":87,"integrity":"sha512-gs8CuuXiCpBGu+rddYmgFN1J3BlI01QgFblpCsWtkP01tvquyYOny1D0c/hE47D2SPpuK7dJgoYxAYoS7EptEg==","signatures":[{"sig":"MEYCIQCOSKo2Wb7EO3sHO6FzI4VBPSPt+VwLtINO/5J2mLi6tgIhAOXCJ9xYxTJCrIv2/AO3PdxXI7/fI8DUoNszGWaCitg5","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":960459,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTqkACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrzXhAAlDITO0rckrZUa9cHjfQMjDo3FR2ItxCjpVsOUetks1grNGtd\r\ncR4QpMdzYeoDM4GcgyrWYLDMG4/6BWuv8H3MHHLjVEczQ/5tCNp0ncbB7vly\r\n0h3IOVzw/Y0PRbnrtmKUl2tMusq5RD9Y8TAxlpV+CC6W9CThWYbNj/XFxHSV\r\nTGqZlk19Gw8ZgCxAVPRkSMCFXdAPlgQkk8WsX+htjViENm7+lEtfBo/TulRO\r\nJTYONeXZTgEWSsjjPE3VLyj2FUZSpq4bBFGejhxNNfhvD+F9GPJ5yQ0MmjZ4\r\nKh4rFAZTPZrwP12tMbBApQ48O9XiI7TXdku2YHkl2xl7MNswxAfy7qVDG0uF\r\nZBmrvC5khCtiseBg5ZQxPEkdmaGvIzbJF+PlfNUi8kOoVNubE44tc5s2SomG\r\n60O93m4fBgqnrwiEzfmn/JLAW/oSAsdvXvq98SMGzocR6xBPZMNpRbftrPub\r\nMtwlopzCDUE01jcT+5ngs7diXs67mVTKyTX9fxvs9w1XxQh9x+SOwDi1TbZe\r\nrsbHXC10W0agTnlbqnWrWbPdDI9nMgzHL9o4oZdYH8wKvlyKPZZc1Ger/bPX\r\nfbO0vEj8CVPMbx0oTatg9vGoGzIhfUXSWrCzBwy19k/g2cocxMl2z2DerPb1\r\ndxiVYz0KNQxldCXOp9OG2v/z69u9kjW/C7g=\r\n=6qnj\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"e8a4443439661b949094a040e0156230e1c29f0c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.184_1648704164011_0.27646515333265076","host":"s3://npm-registry-packages"}},"2.46.185":{"name":"@apollosproject/ui-onboarding","version":"2.46.185","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.185","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b753602529654715a74b0ba87fc36930e28f1bdd","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.185.tgz","fileCount":87,"integrity":"sha512-S0wKAJ4WslrhXg0tndGrHuDqSgTpRlmnd3q0LhzLqISw+jSNnV4Jc09CRFaQp+ummR1GjAqFKzGbMj3YeGo+uw==","signatures":[{"sig":"MEQCIB467BLV4rTPtBVIamHSkDcqwey9qkhdZ8jGq5+ANxYbAiAZzCte2Zyt7GZYx1IliYzw3gSruLVhE39SHqP45OZgGQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":960641,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTtBACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqwuA//azx/ZRYdYq2ZvVfQMjzg0I/KYgHuJvP3r6o/NdRHZd3EMFpT\r\nuyvkgoY+RGT45Z1nBgmkMmcftKzk0yVcCcKZgO2jfRoWCBgfTs5Jw2s7Z42M\r\nPG0oJnSPbLpsd96dSTkxgf3j3E9Y1fTr5VjxNsnKhMWnYwhFb1LBRURykypq\r\nj6mCpQu/qk9piazgaQ14d5NN7Ab68K5Xk5EkfgIuFP3b6encTcz45y00Sref\r\nXYTUhv1ZdFQueHEhH1Tz+f8OK6tTXPfnUgrLlCg/ViJP0e11mLuX4twz1xSZ\r\nU72i/042sWjgZ0yYtTayxDUh3RWXiP2kjU56IRGMhbU7cHblv0+Bw/JAKm33\r\ne5IUBkWTg8dePEU/SxJCPbNaRsM98SQCretCEXJDXMjkp5SdmPv/NB2iX9I7\r\n8Tpg53pN314vlhALFFRBfCpI0F/AltmrwMXi7FIi4eYh5K0KLC/O6C6KD2FM\r\nZ8hNtNAw0PI6wPRSPTslxsQbecHjrTXZJCsosJ1ivHGbtYjR+RW+EaGaiA/N\r\nSfBfIQjgVxzR3LO44FtL8YJFPh9DEJBSyyPvt6sV3EE5OtGPtUBTuwixI/G6\r\nrD/1OPxdYi7+166ZoDqF06RE9yFkQly9mSFHpFXBR2IVfFb/DVKHn+HxEWw8\r\nY+7RUidxQrtFNmLaoPRuIPn9lOHNlreylHM=\r\n=ikmb\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"956fcebfb7e005f77a2776c917c0302ad84ca93c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.185_1648704320971_0.960786494043733","host":"s3://npm-registry-packages"}},"2.46.186":{"name":"@apollosproject/ui-onboarding","version":"2.46.186","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.186","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"63c31399b0b77372575099fa9d3103bf6a019bd6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.186.tgz","fileCount":87,"integrity":"sha512-Z4CMgcNQCdfqBjfMAo6RIlz3/JXQTafhvk8ZcCy3wuPc7ikY5sJnQ2Y71WkQvQxKCYXIaYs8tKmH9p3iRhbdaA==","signatures":[{"sig":"MEYCIQCJXnNMgPsdbOO4wdT6mUuoQ/i4PL52z8RvsydD/w2mxgIhAMPWtbJFXxki+uTA/NvbqprrqC5tKUrFTzYPLDbIkUAJ","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":960823,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTvkACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqCdBAAgJQVwtarAy8kmmr7N/b7n5fXEJVBzVXQXbyo9+VvAlH8Svo0\r\n3MBTLlwZngzr3C0YhM37jZ+sOTXgW4Quxso1s2Z+M+LVNLRkcHk+9wXyaMSs\r\nATGHGmHhiP2D+b7MyYoAAtP7Mq/mE59SOcVAtbv+K9Yn86mtR5O9iA/1IRxr\r\nd3kpeYu8LDooM7lX/CgrdvrqJKNt9NnAuKAYS8U+uhKaANCHOWMYS909C+gy\r\nzuTTVc37ITAUkPymOsZq/ZeBNsXoJAAL29Gs2S9pTwgGva1O34pHkWUE6VwU\r\nY/R8ZM38dlIwFzNqZiMdFrAypisaaahP2AZziyZpLBklChgmIFl6B/d2rWSR\r\n9ol2U9tdk/jHlVGiaX+9qp4oywe68txsfCtL+plkqoiokZOCJIUkvxymDSl3\r\nUXFKhmRebvV+USjz9mbNvxNfwCluF+F3TI7Mz7jjm0NyWDLWojvMS26g2NZ4\r\n9o3Ylkjdo/CuJ+GioCrH0tnBKa7fqOAEgngVQg1lKLo41HMfsNuljvSm8ysQ\r\nT58hZutSOYEioK1DSUkUFjlh6EQudsqbbOoCB4O2o+8REUpcLlQyp/A1A3LR\r\n4oc5nQAIBVtAiuHAmxKQj24jZc80agPr6ZB6fIQIgCCyxmPCRlpMdZOhQf5V\r\nFvjd7isNiDIOWE+FuxMrbvpHK/PPPghLzmM=\r\n=IZHa\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"0fc857e7c10d9c3adc2faf0d1cbd6bd9672cce8c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.186_1648704484003_0.13594320073081168","host":"s3://npm-registry-packages"}},"2.46.187":{"name":"@apollosproject/ui-onboarding","version":"2.46.187","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.187","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"80a1e31d3b7dccb8f41c0a59eb35106e13d04552","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.187.tgz","fileCount":87,"integrity":"sha512-0vgmVaxVidZkYyJut/ZpODKgwW5lT14iMsxsaT1x649z07YqgnhiAPfJtozclpLYayygRyPkk3I/+wzXQPI5Tg==","signatures":[{"sig":"MEUCIQDHUmeJ/nNL52Wz/qTox2nW1Sjj5K1g3qzclhNKuMjpYwIgBJ2WECx7myijnF3/kXvxhKyRp/qqzflSUAC/yz1Oz7c=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":961005,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRTzEACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqUdw/9GeJ1lyUHPQgg/iG5mxD4nxt/FhwOkTtaSkVpkWCu1w44MrFM\r\nqw8xthtmjVc2qrEB9e7N/Lmdni3XHz+kDIRd/E4PlrdJG4mPye5ox66rjtii\r\n1J5clItdZz6UeBv4Qb/9vy6IF2podcgzsV1m8erVpziGlyEypYzufi+9JdX0\r\nPycAAjZwAk/KWph4VT72wq9ciUPE5Ezg8fxF12UVsLwZxGUjNtiT53jfrsKu\r\nat4dS2M5+AJR2jnAURMF5QV1vPxOYl/Wgcj/hjGlHNUkFxQT/7nf7Q7uFzgU\r\ngMx7V/TlxgORkkLxKYmYDAIt0HRasIRHImdH3+6TEomwO+flnFpPZVkOLqP3\r\nW/MyWUOb5nfpcCTzkKeYslJsC+J6Au1KfbegdWkAYbSyrDBEnpX15wlxSlUO\r\nNfDLW4mvxF6spkg2TFttP+sm7GXU4zMkaFEcXELEGj7Wtg7n4V0Dc7y6kT0r\r\nmVtZqxQmVTCmOSVVdoJGmsDtyicEnNj8bQJIT1PLa9DufIh7E94pEW/tvJTb\r\nxvxuux2dqgjqxsTll42QkvQlUawpX3jutXVb9eVAPxmf2I4hjgJGMSFjaHB/\r\nWXGFOgbVeckJoCwh150xdwQTWxLHCtMU04dLuREVsT9fzAhlHC8vhfKSubYc\r\nZAqXBTiUy9TpMFUWcV00UroY85wbzKFSeaY=\r\n=xEbM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d5ca2db73809ce3ce4694ede8be15082155277c7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.187_1648704708231_0.10206918546777577","host":"s3://npm-registry-packages"}},"2.46.188":{"name":"@apollosproject/ui-onboarding","version":"2.46.188","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.188","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ab98a7ac84e4450788141878cbea37a4535b5838","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.188.tgz","fileCount":87,"integrity":"sha512-ibVisT3N8lm8eWWKjJE/za2GRKakGgJx8DtH2FQM86ZLIq84o+NDpHy7Bs6mkFkTWJXyQ2Adisn8tecQ3BqJdA==","signatures":[{"sig":"MEUCIBHjNxBh1oXHImXF4yVBC2xptHsk8T8acITFC2TcGBu1AiEA1idUf/pGO92kqsj+3+Djkw+GjCnyOQCZfauKSpRTOW4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":961187,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRT1ZACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpCFg//XYDePGUIOTTbvYPXdRv6mcRg1rGonM4LzVfUquLX9Ld66pBt\r\ncopkzJpBeOnIEW1po7bu9bK2bl0ep7Q2/CLmVCu+/wY+Iudtc1AycpAkiMZ9\r\n6OOW3bsSjjrbz4eWDugayImUpisAIvKmT348ayWOgvOfNBsr1wkeTmGL0/Ig\r\nntgYpjyz31nyFFQAaRRD+Ve+OEi+Bg1h41hSkU/FsERgoMy53y83ySAYRogm\r\n6Veha1IX9+KIUjpXo/2eQeLvpqiWeHtBo+YjeMZG9NeZzovDpqLzNaP0aa70\r\nKPO1uDlM+OtktYc1UJaHGjx+q3Dw/t68q3eLiVm8hMkhJcsVcl19R7IP74ma\r\n3IvU5u8EBh4Mvr6//XFQGOoaBmm/vTRw+EwowQZCHn+sUs3IDwErG/HGe82t\r\nabH5iWSRUy8EqAR50tMZyKoGqZrTYYqFoasH+ThcSmtPOust3D4DhQTHsrnc\r\nQ7ejUer7f2tXiSudacaXl9eRRRbGJIZv8dGn41J/f7qmESY9h8FY8+BFG3/a\r\noN7ejd7xHgFkiq0rJofBqvfLxbqIkDLW4wXSgJLuBv3+ELpQ3y3R9k4Ax2vo\r\ndHRrqCnxzMgpB3nB+hRtp1e/q5tDSyhWmKl3t8qDnDX2g0xUBvwsSnJyNMTH\r\nFlLLJczoTkqwwAu0LYmkAfPfd3U/HGilslc=\r\n=Q7l0\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"0fb0bbaabf13e3d0a708ca953b9b645be10cb72b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.188_1648704857458_0.7842110356824608","host":"s3://npm-registry-packages"}},"2.46.189":{"name":"@apollosproject/ui-onboarding","version":"2.46.189","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.189","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"de8d3e08dfa1393bfe659655add1cf691133d8e8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.189.tgz","fileCount":87,"integrity":"sha512-mhdWZeXnskDIfNka4w+aLSXHdSE/fNeSbte57u9MDPmuZDkgBflbY5BErlkRAZ3XZSWHAvw+JVglPZ2gOmYTiw==","signatures":[{"sig":"MEYCIQCY4+7HVUi2Ej9aYVQm6R35p+Qyko1uxxw8PBaJo2FAZAIhAPUT+avQolSNW53UKTmHsB5AMGQVhYNvf4IdjQ5Rk+ge","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":961369,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRT4KACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoX3Q/+P4neJFCBFrHcZMP98b2Uja9Mh++Sk6KhBsDKAt3gT3jskUbg\r\ncaW7lOn0pdEYCjQ9SmsL9P17LRfdmh79AvEqGq+6Qy4uwopy45svZ+hGM1zI\r\nYyzKMYwqG0YoItuKf38DiK0JxtpEC4aeYrUCJtn0Zc1wPIfWJzTvYcN9BnmQ\r\nUMCLk4wBNg52WDdzA1JuXkK3Sk+KajNUn9CmIT0i0WhibmmemUVGG1mTtOpa\r\nOlTN8mPs+aFt4vHFOStjuxoHeUtt+fW7+i6Czln1Yd/749iyFMj+UeiX2XW3\r\njEy8O022H8eGdXBigQRbL7rA0Ws47kjX2TcM9O4HDiDFCeftNb26NqCt/5W9\r\neobet53vodYB8MFe5yyUx+Wcs3VIX9VWVDiF9pWf4vcp/cjja5Y8EraPwMGP\r\nNyWPqFH8+NQUkSsJ93DR7sEPbGZw7n47MO9c2LhYghp6Uq8vo6ts1md8Knsa\r\n5AnG30/ikRBjfbXdaxZmS/BJVcxvK0JdApzblzOr5SRR/E/SijhvbklfG57+\r\nFIq+tEBtb2vCB2p1HzPrpvUNcyIYBpg4nVl0MdJgcdlnae7bPJN1DfiRiVGY\r\niQSb5i2OmAmZlH1dwulDsISOycgUqAYOriH/RheUNfcXwBbxGFKoenODTiZ1\r\nqBfAdpmrOEVgTGJTLJxY/9R2PCEKvkwp5bw=\r\n=3h1u\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"1835e8ccfe1737104e2d35e2a2147086e8582a08","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.189_1648705033865_0.5508104084671779","host":"s3://npm-registry-packages"}},"2.46.190":{"name":"@apollosproject/ui-onboarding","version":"2.46.190","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.190","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"5f1bf4f6f959aae31243668d6107d17d30145977","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.190.tgz","fileCount":87,"integrity":"sha512-cwaGOi1H87gSmDXe2BZCHgs7mFTuDjD7wQto0v2jtKl0Zm/eJcX0vAPHjxeFtohKpb9Hj1KJqfB0GzbqC9/0vg==","signatures":[{"sig":"MEUCIQDa0Ydf4uO7dFsiY/G1oNriyo+lTlUVTSN/9nHY8Pyj8QIgI1mSfuHkcfFSbZb7Qfc9JKk0izN2oMGVMZDAr8az3C0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":961551,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRT60ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpcgw//cye9cUIvteZl6Kreydt6ZSd3Ku5iIjPxGTaXqdUXDM3UrLSJ\r\nmuRfGarGHBEeOvMt30kNoFpwvxGsi8XutMN1EkP1omIdpILJMde/gpnL8PxV\r\nrMVrNmRWp9GEJdNcr7EvQy4W9ot1bcMVllbxyo3IgGyKNdPZpq42XmCJXES9\r\nO14wwoVMENOk7Z1YrTxMjTFtuJVGAjunaVPGHjsuYgpIY2ziiD1+VqS5DzFg\r\nZaJeH81I+PRn24ovpggDASrryGLWvl7WYZpfHFbVi9mRtZIRzunoo6V7arPI\r\ncS+yFJgdtQMKP5byt8SVEXXwT0nd49r7ovBCEjHru5U+qod72VLcz7MrqnvJ\r\nrfoHmJb7DNOLK48B8NLggs7FItsHsDNujSlrpUZFgEuyraZM7J4GDcMn6YF2\r\nSkc5rzGbO+/OgSf2G/8y17Bu9GgVmcim3RVVWR9YYJibIPOatQc9HMsUHbXn\r\nMKaFVKEYXCFm2aylQG6kdsJr1fR4WWvMg6wfvFDMuzzPLG9oOfFkQg8bFF7s\r\nV+I2aCxuYb5XGuuaH8r2F2LpOqrxiwJQ1BJ/vYU1m1VcbgAYZRCEJzHQM9+X\r\n1ngQlKp8mAQoDKCvVaLPagPplyTfNF0GJTzvu213Ey6hMdvbhv9JWxuklto1\r\nE2rEXJTh6Y246X4AY6I5HQSCEGS7M3RWcgg=\r\n=LQI+\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"019d5496d7370a150bd54d7e25a89f1b1b64d61b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.190_1648705204460_0.3172966861277198","host":"s3://npm-registry-packages"}},"2.46.191":{"name":"@apollosproject/ui-onboarding","version":"2.46.191","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.191","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d04589782f22027189874f512946ceb51611ff3f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.191.tgz","fileCount":87,"integrity":"sha512-5oIY7V5l1jnYuP8copFbpZQ9FAp8hidD5cxXhiEQaJ38sOQPkjmyDo6awJ9og14GNL3TzxcrLuvGGZ3kA47sJA==","signatures":[{"sig":"MEQCIGHJG50CyvLwqnK+0VCOvLGg6iudh4pQ0JP9jN4iZiCcAiA6wdwi+NrTNhtbrKyO8FBUxf/XuabRmqKacpaLaV8cMQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":961733,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRT9PACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo8BRAAncpkKiCMjwbKwhLqMKSoDU2wC5jBkV0zuq+bRanGtDxS5wi7\r\necy1YgFu0ZV8EXBlhfm4D/WR9B5DAojQpLooxtGAWLCEFCn9hPAIQAHXLxw+\r\nA2BQc45t/7fLWTzPECeAH4H5zWIzC4OP6qSlwYzjQ6zi9Wskt+eFoN7b+NSD\r\n+5N1dZef+yScNNkn+Tp5Vy7xmwjuN2IqrlNDGDQcufhsjGfXxSuRGRxami5K\r\nGVT5CaDj+8Yep7vag9D+wS+xy2DG4yLr16vao36pXdufcr3Bt7AyCorK0ar2\r\nyZb8bqqeXsor22j/Wr9BuhK/O7TuMwrEX4havmeOYl5l3/OngIavXcXLYmOV\r\nwJ/f7RyZyJGB/70Su9g+92pKEwaG0kd7vQpjJ0y3bsbem9pP9iaq9fbry4Za\r\nh51R4Xlz1NpKdmo6Cmv3mW8KlKJ7z1sxJGHPrZvjiBDN52JVA7FwN++cwW6j\r\n91jJlExR4lo+kbgFAyTlw0hZRDP7fWIMYlIrxCbpRpAQu0U21qg3BZHjCElJ\r\nrHshyOQuBpXs09leaGPJ1sPbXYdkBpZykyEHZza8/jyl9q+8auEdjuH2At6L\r\nFcXaFH6aDlTlMO3T4HYXyU0LILq3sIVmLfVMfl7ZlJPKtRtqlfB7nLCNKU1s\r\nwmxN/ZJjhh+weyz3v5tDVCqK+zv3XRJcq7k=\r\n=H/Mn\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"8324b843464e04cd7cd545a37cb6383457a2660f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.191_1648705359292_0.33646387095386965","host":"s3://npm-registry-packages"}},"2.46.192":{"name":"@apollosproject/ui-onboarding","version":"2.46.192","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.192","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1b2d2272ffe6b33cda0271c18d78502a41a19928","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.192.tgz","fileCount":87,"integrity":"sha512-kuoncRnMS0g9aebOwiVvO1XmxItr4sxWUV9qFq10etUDbA7BkwKYjZvyC59fj6ykpUmmrV6mSWUE7riJ8wwzEw==","signatures":[{"sig":"MEYCIQDOTnAyDfHmvtIfM4y1ONuCe0DPmqc4s2sx0Raa7BuNwAIhAJWtxizUmElZ5Wh50twzRAEKTQLE4nJ0qiC1oUmxPm8C","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":961915,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRT/yACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoquA/8DSTwCcNYjso1B6BfMViJNCrgJPKWOw8FrfrBI6bCKLIOxcyH\r\nk8s70Rt8NTtd1FXFi/rY0tqOrEwbFg++hQGOIINvxrA0wwzw+DXEH9Eo5/7l\r\n6PqRSJ5p5Uvpj0uDpjEbXyGTd42VtXVIablODYWMvYpYUssU2VYg3yPbFFvu\r\nnuEfukioXIILJWIoNh0IFuJYRbfVP/LarXmaZsvkCB6DSSkLxi3DU0cfDe4P\r\nwnUUCZ6HuyuQZ108JAnHO2Hm/2Li/2MCbNC4QecLhHbo9kie2A8aN94JJ6E2\r\nac2GO0yCWQ3OgcCEaDLlXuQ1RByDEDZZ+5SAUJX1t9hzHiahLmQ6PS9VS1jj\r\nrclJuvU00PhTkA09ZZ0APGNeOIZD68LKmxSMTKNqT6N1IAj30KX1c7x6Xtkp\r\nNlD42KGPDmBVb26Xs/Petp0ddLsVC6tuQcGOzU5DwnxAbJaIvitSwFvRDYG2\r\nVJhE6+zrNf7epQcBQOrhnPx5l4W+mOkWtQNFFw1ufgZ1+/IH3sed4Td+MpmY\r\nkpJ7jOsCN10dBpTZuOkCWgAdQwoavR6Nox10KLh9Bo1l1/Miw3NiDZ9ZTntX\r\n0w/TCcT3husr1BNLnVJcRFu8IqA8YKCNyG3+Iby0wO5gDboQLLR7W5zzduY5\r\nQq3aRBcMCBrWoYzgw3bVSYZPbwTRvj3FtZg=\r\n=zVl4\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"2d17456c3068820f95329c774a16a033a0fc7aac","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.192_1648705522421_0.9754770441383958","host":"s3://npm-registry-packages"}},"2.46.193":{"name":"@apollosproject/ui-onboarding","version":"2.46.193","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.193","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"41df7e3abfc745c4de319d4ac4cab5745339cfd2","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.193.tgz","fileCount":87,"integrity":"sha512-+ZJzTRvHypSdHrOYK8tg/pkY7R6wTbwNHQ7BUY/xTW0aSkY7YtUXhosAn+D8IiIXc2cWkHJ3FzI50JDsoVNDhA==","signatures":[{"sig":"MEUCIHFG4qbnsO7KjkMahV1gKQO92uOJy92zP0ukBrji+CQHAiEAu1ulzLyHV8UHbQszMY1ofyRNEMq4ZbtFt3llS8I9C8c=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":962097,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRUDiACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoxLA//X13QCFQN4dQlUNitCktxzWUcAo/Yc80vqdBI555YCijBQXDk\r\nkEUXYNdjqUe9JWmvTz41at2ieeEVsv/mM4tWwbKUJlC4sHt75cTrBDGq2icJ\r\nRovIwY9ehh61YAs9m0LYpzeeqkaVjp1ZwG3ParDhlYshBt4BKtLkJ9OfErYs\r\n8YtQusP9x7Rd/Of24aRsJlin+B7GDfaIFhkwn3LmGrmApAADcs6UyG6RNFZd\r\nxM4+BYPJoLHsYkmEAJseKsgQR3uBzK3HjAiunyNdDKYRq6dgkvCPYu9Plb+Q\r\n+6a96ZMqHis1udnzkSaxzeREO/CnaZS7e/Ayng4udaeI6R7441kBf9ypG40o\r\nT6CK3rMWkAFP7a23A2o/KKG7WRYZoNCzxQtU7nC9HwbHi9+BCNTFDVx2IcI7\r\nASNQt9+Vs5hDnkK0drvCiCi2AldVRiVbm6kd7vDg6+cDTYVa159kbSnaLXgm\r\nB3lG7n5FfR61q2R1KUwDOAfF4tuAWARQKJFYZePxspJX9rlvTEkWgOVB0/po\r\nna3pnDrdYq0IJt/Hxo452HuD2wpddYqW1n05tkZgU64MtydkOoXaYcTi4KlE\r\nOuo6a9KQwYLsNyk4M9xEv1Qxv8MGiq3F1/ngE0meqQe645GTDsEkTSui5GEx\r\nDefIh5K8O4aGj6guE4hmqoLLWELlkc6i+lU=\r\n=3MUa\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"b6b952bf4ab5d216596a153f2ba2f554183bf736","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.193_1648705762790_0.018166563823002857","host":"s3://npm-registry-packages"}},"2.46.194":{"name":"@apollosproject/ui-onboarding","version":"2.46.194","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.194","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"39403558b377bd7ea66ad9c94677253f67ec28c8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.194.tgz","fileCount":87,"integrity":"sha512-olIXr7VcaAkTdfxJ0APaUM9l/vissx5gdoBQcx1GxqbZZYg35/5DRufOuxf/tx04xrdLZAtud7ICUxV/AqgRYw==","signatures":[{"sig":"MEUCIHrihtOfRTgy8v/Guy5SwWYHDGpCKzqLOMRA2pVCQyZIAiEAq5Z0g17QvgbMjTApPVPHme3raw+JiMtNkQ5UYRnimU8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":962279,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRUHAACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqQyw/8CQh872L0tkr+pBymnKoxuxehl6Y8dk7zhVY2TM1kWIGE64lR\r\nTLbYYweSLtdyroD+mVQ0i4ake23dsyrO8Nh8jNthQ30zuZ1Kx0+6fuxxQWVr\r\n7aLbIKdEW+xEtY+Wc6FTxBVPwgZVnsv/5iYRD+aPhhJ5xa/vB86J/NRN+NPy\r\n3LnrAWMuNg6rRS1uruWwvho5O9Omb6nu0Rmpx43ODJvV9mlFS7dpLeW3zNMz\r\ndFm6kRfth1DMBRYd4DYu5JFgt4aIgztnSe9WikvKsMp2RfChyPQtwYnYJ0ew\r\nk4Lz7rDmgxyEHP7WWJ0jdXmYe8lbwuiNh6sca0ECAkpgRluCmFOl2EpFKuJG\r\nVNEEaxuCVXmgLxfXufXtX3ikKGRjkX4ZjDKaBBHTAkPSfmf8wobukkV8Dfim\r\n2w7FZjXg+lgJz1VvNkMuTbSaK+oiw2MxwkqzqaBo+79d62vfNi6GHaLpCtna\r\nozujCr0FSVhJKUHyDc3DACGrSAqECJIByomz/a692LEv/imh0WtnDb1NujcQ\r\nSaQMxx+MaCx12BuDtSPmuHAqCkCuxcL9JXVcjkUhh0V6bSdVBFXVtxqCDD9c\r\noZ4co7pUI1pXh5u2+vLiERY3gU+SpkcmExke+mDsMayY0M0N4AdJfF8KKpSB\r\nVICADe1Fwf28gjIQxdpKiLOhj+y6ZHDr2Ls=\r\n=RSq2\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"15d960e8182e5ee80ad2a9e7eae294e5f2c7efc8","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.194_1648705984239_0.4186726267999712","host":"s3://npm-registry-packages"}},"2.46.195":{"name":"@apollosproject/ui-onboarding","version":"2.46.195","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.195","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ec8111ab82d51d11169e256a965e82615b8025cb","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.195.tgz","fileCount":87,"integrity":"sha512-dOIHSNgpOF0kkf5jRp47a2pRkPdD1oKC8s7yD+P7vx65SqpVlLsszofHzms7fiV0eUH2IpLHy3lwmvLawnz8DQ==","signatures":[{"sig":"MEYCIQC8b0i1E8KLkEk/aITsGt+cFYmNpxlHTIxYYYFjyZyOYwIhALcUwDYfb6UX9KURAQO0aqP0WPHXOOqrjaNbRToC12pj","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":962461,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRUJqACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoKMxAAh22xQjBGToJT6oJXU0Cdey6MhncCTDFW25sqEgN846HJjqi2\r\nYUvuvQhXMwE4oz5t0F3qWSNc59VtHoZAPDMI3qmqQfDYQ6alF47IwLAtdOSp\r\nQc6zveXU1LFyR1Y9798BJQIZHG/l6rat+UztwROqO986fpCN60TiG1BBGEaG\r\nG7tbeN3X/n1xQcpoa1MUpysZdKdVOqWpwNNBB3yx5SnZNCIAJCROTudVCyvt\r\nfnxqDNyygf28iYrw5nNSclo4ROnp2tn8djypPsEH4DUxCIp0ciTH2PH5N5gd\r\nKZyiaUC5GcZ4aBrvBdbauind11vl+chJ/Z4wBSoMjLWBMsEiOc3amtyzD95v\r\nRgDi6UaYbOig4g9FCaAdrRziNwkEjMgNj4Q9ilxyt+VFzJIRznUxohsK4roh\r\nLFb4jZfdrfg7GVfd7mmI+qH6ugLTato83POLlCH+Bp7iDT7i3DUU8wOvFXZG\r\ndytBBQgD0/k7khimc1KBSVLXq/QXGCOIOsW/VTubdtMGpVIyfTOeJ+HqSON4\r\nTBud6QoJxdi+F8gwPJbTqLoUhcLfDhhqSGfH7kN1NilfaZInggmDw5ivneuu\r\nQ8etshxSyylRLGvtKyiHq5P3TvP1mlGXhXhxmf9aX2UnIcT4t36kXUy8p+us\r\nEZ5wnlgIIgvXHREYCrqJdvEyIfV3pn71gPQ=\r\n=VmV9\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"dd119184bfcfa9a063ba8e869d65e703149b49cc","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.195_1648706153856_0.9037932315403869","host":"s3://npm-registry-packages"}},"2.46.196":{"name":"@apollosproject/ui-onboarding","version":"2.46.196","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.196","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7d9dc543873ae5b2ca8cadab8cff04755b4b4c5d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.196.tgz","fileCount":87,"integrity":"sha512-SXXswcdlnv5hneTcLXxPoRfdC1JhT9zNINds5H9JIs2R17K1jrXwVr98Aw03m3WYpXajvBMtrt6BorjPlALIyQ==","signatures":[{"sig":"MEUCIHvyMghxYfKKdOO/yjeHFJ+ajq6QcvzR2ewnr9OGuQ2yAiEA5bXO/1kFrD9TujIW5AX42OV/Q9GXZ3X3nB4t6kpGwv0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":962643,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRUMkACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp6SA/+N3gXqP9vAjKINxJyfwTkVKcrtL1oQsmyEbydlioeKLCZTXXs\r\neQ4/4VSny6QqJlt0JslxDoXg2JH3ZH9/+Ij9GJra8ntIukfxWObUDuQPyUWA\r\n6f7qvSLzgwZnvjkj3JNbTgdTpg+HFkTbRZ4+dQGjNPt7w65PwZjJfiZ8jeF9\r\nFjLlVplw0a2nD5+H9eRdyWiCgPwuQPFrulKr/VxzHxKXQ2Xreyl2yCDl33fJ\r\nixhyNt1XDn8bZiLX0DIvPduhp4XUm8L9qDj5zQgCJ8zbx5D/bMlvNZavqwW8\r\n1850Wl/OLuvkZ67fnz8l4CE1bra5S5R7j7yT8ZGRjkTGLlaum/yzf2BPl2s6\r\n7pTCYRHZ0zHeXMFhKMMNDkDfx5OgyQfILyV49kMbGlV6PyagbKqVa902MHLQ\r\naob9msxMShM+CS4KMV+/91CPh4E7k3vTQAX5efNqbnbETbHBQhHNHp387+lt\r\nNasnYNsfPS4/+K1pemh1RstI7ZUB8aluUI7g07eO335k4YnQL7X5THt1zUhg\r\nL0j4uIswws1k7GZ4X48Pm+QQYcI8LVAkltHMRu9xvFNkljOKBmH19sgWgJZn\r\nOhCScvIMezoXtesmcBNzVG/4NhbC/ToGKD1HzhMvHUU8YskGlLHvuJwvOCne\r\nAcJC0LPbjHTiIxC+5Ri8fYsB6l3imJZ4VAA=\r\n=Db63\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d7b64afbb231f230124b1ebd32766e2ebf8fc176","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.196_1648706340588_0.8616864205369854","host":"s3://npm-registry-packages"}},"2.46.197":{"name":"@apollosproject/ui-onboarding","version":"2.46.197","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.197","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"373fe8ee01265cd4ed5578e52c6477d63110acbf","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.197.tgz","fileCount":87,"integrity":"sha512-lJiqyiLBGeOUGF2hQ+g9A5DrfW73Tt/lCTpZSYWvgXadwu3uohls3v1QC6yEZW5NnYps444gqmrRKF9aWNV9PA==","signatures":[{"sig":"MEUCIE8fyJbX+N2LkphWgGqInQ8UWR/FX9HG4fabuJENHgOyAiEAsShk7k51j8MBJaWM6DIVmLUGkq+QHIUaUT7tzSml4/w=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":962825,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRUPZACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmocmQ/9HuPMnEmFmKiAYWJRv18mvbjn3XDgXFxO6YWLFuujKbVSQ2Mu\r\nJ7AvdZvkaVONxX7BjjI8ZSxz9cfIPxhMgd470G1h7sbtEaF6Whd2AUD0xpZc\r\n8JTu3xLBWgaqo1VCGD8HvGkwupFBNV3x2BerYA5IIO2J2445ENUsjqJYKyIo\r\nX6l9+C6McXOiM9eACDBMTRVj5QV9GQHbacaGiGmkaOIqybPtkwPzMHKgsXRd\r\n3DL6AF2Hw+woqI9r+RNyP7HtUbL7jZT1Wx5Oqm3dmjemWevgBbcVsChH0Tcm\r\ntERQNTsrWFOq/zrUPFXaEwOTRrvR8TXHtS848xvM/e3p6+HuuG1xe4YXBuzf\r\n9hND2WTXvGjXsX++KJTL9aAeGPX6rdozSodRnWzJ66VK711VYtbqG34jiHBa\r\nUXoUgjqNk5fHCm6HrmXdiV1z9AP/rVCyThZLup4rFjKT/C36HlcRZoz61Qbs\r\nsF54bdY2mrlF4s6hIHVHW7pg+vu52g2QKG3QjzJTgSYzuHVy8ApK+x3FF/P1\r\nz8mvi1IEvrNrzNhGeIB5fGbiiqLXkFpaXf54J7V86aUbKkucfW1ZwqmSkjkG\r\nOHTH+f0OAmW/hmQK6fbgEReLz8810TjyJyKMpyJnEvwbH7e7EaHw5+VsNclq\r\nJLvCoywKUbuj8J5wUlfS8VMU5HgnBONdJPY=\r\n=qLxb\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"17ebd7c5630f1cd8074909f74083a395cc1fda49","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.197_1648706521128_0.8850284366519638","host":"s3://npm-registry-packages"}},"2.46.198":{"name":"@apollosproject/ui-onboarding","version":"2.46.198","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.46.198","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"25d088cc07fb6abe10fca9569f5aa4c36cc6727e","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.46.198.tgz","fileCount":87,"integrity":"sha512-m8C2DbXER0tKLBmFKQEZEgF6je6Svj0rIe8jWCeZhQZbWKb6wGPN/dLnwfY6O/Vt469l2B+KObo0G0Rj3AAREA==","signatures":[{"sig":"MEYCIQC9RZJ432QcSFWK+1Y7DDY9+Cjy36CUog0qBEp7t33zUAIhAPY52cX/r7xxCXs0OUls7JljFfk+WXnclvoARliwlgDV","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":963007,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiRUTSACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqDyA//fVFVKKJyMaaZhWmezMIvKm5yaBQX+v2Ri3Ta9UxLkA3kiM9b\r\nvhoiqR8d/ycgR115j02CsD1Dpml4smuYxydz8UURF4TBs7A/YDNaXpJNKrrY\r\nIZHG6dijYEvc962wcGxkv8oDnX5pc5874cSD106rxpb1LV/PsNdwNqjvqnEy\r\nYKnVdux6UuiVQ4FYwQ0qQUUwnwKtley5iWQBODsCVJc1JxOAX/8MtJ4Q/3rw\r\nUvEppFuYGsE4nXqq3zEr1/Zm7h+SvWqr7NoWSV/+OivIIkzbNWauWUWcLdmv\r\nVGGgJ9PyGtUEhpX0R9AWyLcxzhNN18Is2XyQTkMegaO/ZrX4A46/zB8YXuJD\r\nlxTqSyhgANZjRG1vCXcphJxj5zno5XJvh7SOMy7YxPdLpZ3vxlaJX6zdVLZG\r\nBqfQ/DOrNEnRybPYMmDsi9mzwiazb3QDS9Np64Hh8I6jsNKYxsxJw1st5jxN\r\nfwOIZyspDqHMZtSBrg47mV1h9xkQKLibIgmZZ4qOxChp6PGShTEE2s6i07qc\r\nQf8+KzXyx5IKv9M1XRDsUSx9RTpl3NQKnps3NV6AqeU7dZuKjpMmCIzHh7VL\r\nIJ2od3kpVym9Q5UWSYOC1SDJrubROrm8VWN6o4ERghH6AutHammig82by+U1\r\npCKeBs0MGQ9ESSzBjL0ku/Xxmt+2vJ2tnAg=\r\n=8gl2\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"c601675711969aea9c21d88c5ef2c5731e044911","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.46.198_1648706770787_0.2719012128144629","host":"s3://npm-registry-packages"}},"3.1.3-canary.0":{"name":"@apollosproject/ui-onboarding","version":"3.1.3-canary.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.1.3-canary.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"93aaa6f43e37468fd05369fcd9c95f35bcd71200","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.1.3-canary.0.tgz","fileCount":94,"integrity":"sha512-r2+czRUCATLbr4O9qgyz0k2G3BtrZvg21kZ2DFwp9NvCUz+vwVIjWO6vjRMdxxsfrkqamYNlYecr8CcFIKjn8w==","signatures":[{"sig":"MEUCIQD99KbIJyDnKY2Wdtjbouj48lp0x5U+n0NuHGb3oGbytAIgT7828DAnqGoC8f5htH/Z30o38zswrdXjz0/9kYoGRqw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":974667,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiR14BACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrBVRAAiukSLO1W1z1dFhw8jSp0Z0i7pLS2Uo3ie1g3jcnrn7QHvN+X\r\nF0DY9JSuVU4oxdER4orcaMVIcBHbkeiJFIwlcx+VzxfzUYgvpcnF1csYxdU1\r\nJRtzcXvqN+qJVKs/21veeH7sNlJeTzs1++obv70YZf6+dQi3ksEZ6acPQ0Ys\r\nxRm2JUVCMIHAt3reu+CYAwBgdWGO71i4T/NEPe6oUySwVkBqceW5Tnup5j3I\r\nQM83H9qRq6gAMddZd4VcosW5pibNIlvvkkRmAFShiu2ZRJfPbvrEMQ90SJ1x\r\n5czSGdt1INIKrKGR7vHzCiMdbBJ86joz2uQFxjRe0Nr9G8E9GX4OqAO1U11C\r\n1/NaWwgYcBSpErXJCht8cCebDP5r+YhNdRfgqpFODRTHSd0k/lkSiVmZqckD\r\nwTmv3dEEMDRpSZiQFKwJTGx8DJWHqSAmivAbIfJLmJOyIteAJ3UWRhuHo2rA\r\n/FU3O04qAu5zSQ3ohCvy4U88WfK4NyGHRpErlelg8FVXO75KjtdC+sCFEzJr\r\nzvYZsp4DdBfehAcTXvFOi2N5cOooV4p8qzj9yPk+ljPSkl4rIzl5iEiKED/8\r\necwN8074lj5bDbwI4I0AIdCoqL/BBIR0aSApbHCoeKgq9qs0jCGDv2Kn9Rhc\r\nuNJ0bVOV1bcnJxCq29dDdnLQrhS1jjkHfg0=\r\n=SWI+\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ca147fd801f21d946e07d61c6343ad52283085cf","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.1.2","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.1.3-canary.0_1648844288846_0.6533597045990744","host":"s3://npm-registry-packages"}},"3.1.3-canary.1":{"name":"@apollosproject/ui-onboarding","version":"3.1.3-canary.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.1.3-canary.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1d4b469d905c57b2770032514fde60d85c97c102","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.1.3-canary.1.tgz","fileCount":94,"integrity":"sha512-sl9ExRaVGfKUI64PhtMmIVaRzA3F6QWh+bO62YNJ5mn7miQDe6dwTpVyv+44p3ItA+rkTPnyvvnnT/p1baxJGg==","signatures":[{"sig":"MEQCIBAPTErWo8e37qJ/2FTkt/4qe6EThzzT0IJhTu8TFEJwAiAw3EzA+NlnurdpxqgGCocYOY2L2Y+yn73EcYxjZo0I6g==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":974667,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiS0YFACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmojPg/+M6rXJttoC3kGo5Au7QMmlOslsoaFxR7CX04Pd6bxbxuNg3FQ\r\nvAxNxF0Zh3PsWOXG6wPRRIBACqsTOvEd62ShdNIQrLVv+CfvC8niAEe8iX3l\r\nZcfo/QRJqLWPlC0XtNNN0mrsQOPqtBoYlOVA8FLOejL0Y+uTzkRS0MxoMljb\r\nTCdg4fTPvwQyLr7zL3k6ThJHZcwY8mj29jiebw3I7R954Y2bMybpkKJEyBnO\r\nCpYKiP4oJjJkUvXrSuCNJkfYISW/zmTKavcpeTJ1xXdWcNgBscGVcIc4b/iS\r\nkePPW1OdxRGCoLB1pJPbVISvP7P4M1J8ovNLa3KmhGQ0BMkETcEGVbOK0uy+\r\nEeQX/gSMqc/2wmhe1uL+KEyTMIIIsJtqZAEC7wGesVVeSX3hmSs5cmDQgEEj\r\n4lmkIWEeB58q5Ef0R7iXM/pSuzvKXzXa5ce0O1l5+kfjWdmNlY26YgKPZApq\r\nzjWbtvzlVfagfKUlUejc8+JwZF9Sp8vGPBMdhNqKPY9c8yy1XE8t6eiqZg1w\r\nxrbprfo1po0GZiZJZ+XZunuH75n7KRsWVP8kQr3M465NWXELHKqxEvwaa6On\r\nmj+pY7PcItpr6UH9BvHE8q1NJSsb2YnWE/JMdnXOx9rgqZG752nKdA4Mrh7A\r\nwUOW+DqggJv2Nf1epQEVeAnm/+kHWKxZV0o=\r\n=hyw9\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d837256509984f0566102e49e6a0f4f6324c906e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.1.2","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.1.3-canary.1_1649100293158_0.10294695763682804","host":"s3://npm-registry-packages"}},"3.2.0":{"name":"@apollosproject/ui-onboarding","version":"3.2.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.2.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"79443c08bea7d646e288f5b7e027d161b595f8d8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.2.0.tgz","fileCount":94,"integrity":"sha512-6/IhXW3uvL/ZAUiHb6vOBCMsX62bQEzzJFp+pIqLHD8PCpKG8ZacEcsLeFbmZIgg9KB+K14DtOSYC/TD7Dup7w==","signatures":[{"sig":"MEUCID5SbtKQpUGd8yiqYwBGSTDsriGQEd+LtwKSX3uWfq5tAiEAwz/pLv1rPM1jNvMHE/FkoUbi86sxrU5tog7FfHX57CQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":974994,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiS1gJACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmppzg/8COGZ7i76sPAhHSMqONOnLPvcaW2OWuFRn5eddWaEYLPecFLz\r\nBySchMEd35T2nfmAfM1ikwjUrLFr3DENyLzfm9pGfe47ygNY3DdgUlwJtUX/\r\n4jgLnznpMdNBnfkAHLw9F2XoFkodu5R1/5HHV+IACJzre4d1C+bKcj+DX4Uy\r\nWQmJwEPVAeM47WtXAIUb+ZlDthJMRLeasgQNue9sRq+EHFwoODdUNd+eLfWs\r\nTjA/oZgSg1lHfPFHq54Bmy3sdjW9FR5n8NMNaSPgWOmnIB1d2pk2lfTEdJ9c\r\nC5cEeBMlsFNA3dPukyMQy9LiOWzyn7fWPrq3Pfo5cfsVIYejfv9C5tVucSH8\r\ndepJSkH0RqVWiPquRrY8IF8MRkj1EVz0oTlrN+6Bq5NJAgMeZhrm/1wCeM7a\r\nl7ggpBpDZ7o6rjhDd8cR6TO7tpwgHuREvpRRinASQGN+p/Ng46pFBOJHEViE\r\n2rqiKQ/kaI5l2lIsC+x0tynRSbbunxrS9ttdiXncY0wvpH73AWf1yfFZHmSU\r\njamSX5b1H5n1LO6BMIFr32clZzaX9d55SNLIzuoazTo4hAEFtR8nsDQTjSB9\r\nNz5Fb5z+ZaTFwB8Hg5dFyvAjeQKOHuWkCDuCz08BvSBdjH1k1yoV9eMz8+tt\r\nNhEd+oCghRSsDjxbvFXyIjJhQe/VkYVA55E=\r\n=o5k4\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"19b0a2e08633ebf041ac4eaf8784dbe5d5a19e1d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.2.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.2.0_1649104904892_0.45268070012267336","host":"s3://npm-registry-packages"}},"2.47.0":{"name":"@apollosproject/ui-onboarding","version":"2.47.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.47.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"bdac946917a5a03ac3ab175f92bf21cf632ff0c6","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.47.0.tgz","fileCount":87,"integrity":"sha512-rIIhaPeGN9sJwcHUEDKIrTNvYUU4sIGMwDovloGE/NnrBHFodxWzdu7vT8RNqCGyvx1DxUEr0fEX14ZdX5VRzQ==","signatures":[{"sig":"MEYCIQDV/3lfKgRqOvZrftAbo4jY56t8NXFb72qcjWeSFAVOygIhAM9sBHwdSlbQ/Mt5+vZcH4N3USKvKEvvBLLo6YNMuHWR","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":963182,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiS1gdACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqj5Q//QIp4WTnGBfHZFk5z7JpKD4ABaPHCh2M1xP7dKBjveNZOWXHF\r\n5WG3wc1IqzzOXfi29UfMK5oyamf6avNEXjii4mt+2eNJg+aBX5kZG9AeXEQg\r\n4UN+Mtjk0L6mgYpk85jrDWW8I7sx9HA6tCTkHkDdT28GijiPa5JYpahe5WRX\r\n+GDawbalZRux7M98bVWsA7tyTZcTaAFJWyrzB8LpuoCxf7wf7zRuY3aGsupY\r\nWh4Sn1YD3tbcjiWzCAn9MFltBqaf+AixiPWFLz4pqixx5kvUtHmExhRexIK1\r\nIQ7Ge6ZfJ+HK28h0UCFUrmg+oMe6pi1iCmC1e0WU0h897tLGW+AKPWfWTEOE\r\nDnwXckTkOUAiZXyx+NrJLSD1xp0QGH7UZK4WWRf7h0T//rmUVd2Uq+Jgu5iR\r\nFrLHUgEuTgKht//N5EkOOB2NEg4hgNlOpOJU3sktGDI/njMMl64rNRcfBTwF\r\nslv0LDsAImRLMc1Ef+TWXdH14Pf6gJoAcdjI9kNKRbacvQN5ecwtZgqowzrg\r\nfw5zpyl6VhmIdT0f7POGl0awTluq0YY+aSfeay7r13VK1QkXunZwz725nQ5B\r\n3MKt6/nwnGBVAuvDHRdr/GUhZ1bXnH5rVchtKH1VgMOgiopZXJ+9vt7fs8Mu\r\nKTp8wBpzq/hYskK8+DF4fzg1qxP6sG5Q5+Q=\r\n=SZ6L\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"427bd1a733a4800f308f0ae87d0b61ad2275f819","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.47.0_1649104924866_0.8697088731946838","host":"s3://npm-registry-packages"}},"2.47.1":{"name":"@apollosproject/ui-onboarding","version":"2.47.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.47.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a47385824f9d2d192ace50a9ae790123624df941","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.47.1.tgz","fileCount":87,"integrity":"sha512-01v2z9AzfpDI6MHrea5FU9nEY+1HUBXLmOMZlKsTj3JBJjfoPJ4PWsH0A8udfpMlzm4sZuqFMOnSCe+ytJAMfQ==","signatures":[{"sig":"MEMCIHsGDZFPEJn49kJrc1m8OLw1wAv98hh4vMvLIkxeIYTZAh8RJiLesWhwqZ83uFYHIUiP1J6NoxpO9Hk7O7/yIWmz","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":963358,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiTKWqACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrXEQ/+KIO3/+gYK1P1QX3H1zxGfAK9nIOaRrAZQ2H4JdEh8tT1sYYF\r\npebzPoCzgGy9ldznCKGZHFcETmHUFTUtUh6F+vp/DKf6yYnJ9KDwuZ6WpgkE\r\n83YbBXrEwbKlfl2FiMAJQEM5/byveb+VY8HUkwZwc3gXrJXb1L9rV48YeyLa\r\nrs0FuhhJz4XIWC4BUbM0Gu4CswkcbGAkCUeZ/Ig0vjEalGdMpqgkYJcXrO5T\r\n+L9zosVtq/jUwejarkiQ/6snyb3+ZQ2ZMtVMvSa5b59d3PX3GvkV4eM0yAbk\r\nKnBVWwJ8P44bv2r73nQDH32/W8Hg6+Bwwfd8GJ4ZAKGF7dU/F6YbHKTYpa48\r\n/myWMgFpENwFZUFJUJ4QYtQY96sB+qYrDojswfc0Z0t7w1KOPJvM6RIHOnyn\r\nbAH/3mEoGM34r1ngGSJD2KiySQgdAkUQq5TiaUFHuogfU5xKb/zyqtsl2iV4\r\n6+VYvp0MJt4JKgIglvjLKmbyQE+U52JwNJd0upuoaWN+1xB3Zrnc9WyegoDi\r\neXOa2E9Be9ODoJBdjTaQPGjiasz9H6iyCyYz0tdHg2le3X9GjhBwWxz1upel\r\n8cdnc481+OfvuYEgz9IGEZNFpfbnobpwZZH9CU1Eid6vPkWHmDHlZbrgIFaB\r\n/E3JXTdRCRyK9MGbide5HAXkGY6CFPJXZQo=\r\n=3ix7\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"d5ca95d54444537d3f21d3f76f68859c05e7bd72","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.47.1_1649190314741_0.24299641488664792","host":"s3://npm-registry-packages"}},"3.2.1":{"name":"@apollosproject/ui-onboarding","version":"3.2.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.2.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1bf24791a19a6103cdb1c0b6173c07090a040f17","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.2.1.tgz","fileCount":94,"integrity":"sha512-rQ/mtqdCEGWeQysJ3O3R2u/yuzsqNgm2RDpeooMZI0GE3jlc1u7GDXFk7FEJrxHNtt2Dd6OGM5MVKBBxjNKMpg==","signatures":[{"sig":"MEQCIC5RQzA+dduBVZaaOOX/CWDKp1rSDwXo/a1ec2tdLUaWAiAy/mvTLZJxfHjh4LxSX5ebW+PvNvH4bRNupHnl0a1juA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":975167,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiThCwACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmoacw//aIruwL8DjD/05quqWxp1J6xQ69Myyx9YOypXukgiA3sVRjt1\r\nL0/1DYnFCAEXarNAVW8Pn0qXt8sKfyt8SZEF0p5lkBTnIHs8D/bD5USc515L\r\nqiB0HGVSKpQw9Y6LNNYckhVHOPRTkq5NRr7BOdS7i3BRJLgTRGnteV6vZ7Hm\r\nUnhf/jViDXDCC2phYW45/kzaa0vCVPQ8ZqaSSitIzs9M7HR3X3QwIahvFRqj\r\n7fuiIymY/k57sbXqJmUCaGC7hDDwxOVKBVeb3re5qgqhGQtRcO0oEOIk/r6a\r\nRXZ1l4R309WY+HXSWg40W3ySWe+8FlNkRp8k88e0DBhyFriAglpQ/fRThc/4\r\ncDArEbP0LWJ0zyc8KLYxMZw4MKolklMV2elV213yLTVGt+pLCpSi2jmaNQQ+\r\nkVFHlUmc5koBPEzdNZBn/oJ1hG8V09b6lxBOyjQQVzSj6UegqunB7wHVo8mi\r\nPGxHEwI0cqiroTj9Nmf7/o3RynJIpBijEK7djU8k4uXTQTnzC9NxDOdLLWQ2\r\nHAQ/eIj1Io4RN3DocKI5lPWyNshJ8GYlZsrc0Q64uXbiYZzJ96PIocNJBzZZ\r\nn0s4EMqL1DqDOuySI0mnfmgRymzkIC0cRu479qm3aOAu6Wle1+E8u8Lwac7i\r\n+lNrFfRx4cCLMLnm46si3WfIfGKGgJlgXzM=\r\n=/Ljz\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"4ce9708195698253412d4d19d97319d84d6dadf7","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.2.1","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.2.1_1649283248417_0.6807818167487938","host":"s3://npm-registry-packages"}},"2.47.2":{"name":"@apollosproject/ui-onboarding","version":"2.47.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.47.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2f229f94c4f7f169d0c08c441a206632cdbffde1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.47.2.tgz","fileCount":87,"integrity":"sha512-TI99Mc4poO+R+pv8KAORFUcmH93Ltf27LoJkkpRTbVQcF90yBKuIToWjSWdkH/rjC7HZk87uKNBdPYpUmBWAGQ==","signatures":[{"sig":"MEYCIQCJQ3dFLBlXjwSTIx5F7X28UUdo4gV6uQo8PUn5x1IoCgIhAL1n7IE9nm80HHhdOwLH812hUxF1hm6ii+0NGiDZDBg9","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":963534,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiVEvfACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpmOg//T/nYBm6HZR017tsSGENzGxb6BIrdRM7jN688CXjM82eEzBoc\r\nnf8csHEUrL24OyKtdTCWlPS0PmljSJpOjUR6dx50oSG726zH6fnO1dVtLX+s\r\nd02MbvMO9Vm3wSEsR+QGDea5L08VVwtyqqX+3oOgqwVeQUSH3RDA6LvsW7z8\r\nswaNgRmWHadBSl3+DRk61YbUbPYBr+Agk9gdtdC/HeiGWDFnLEEf9SRf4EVy\r\nruThWh5rVCDZDQbZ5kjdMFSGUG7rBC4b1lY7dN/WDFuJ9W9LvYSjL1KN3Cz6\r\n5TOpjgF93mA+c0W3Z4d0a93Q3cq1xdmalwIi+ke/P+WWMcuK5JGlFguk1spc\r\nvXi2xl4G7+vw0RLFoOth+ME/Bpr+jfJgow96+x+FyyGuPR8onrBE4RdHRi7Z\r\n0vzcze+0fTR1eu3nWBl6SMHWFAHfuajRq6pp5M3oanbHiwtympAIi04VPCNs\r\nUvx/XmlyiZd3XiQbBgewK0ZBtxdAVs7BiN696rRMBufITTt6m7Gdd9OZGzhL\r\ngyyToBa2cGvLoRgPjJZ8B8Z/2DjrCdBmc2AShNzUVv41Mfzt+eeuAMvnOCtj\r\n3Vlbu89N0wKHtjWERtxX8cAzlXUdzSFmxObYYRI2Wi2vQVveZSgsKrM+sYX4\r\nb4iWevb/LNXVXrLk3yWxhxyLFI59Lw6x4GA=\r\n=F/Ju\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"e4978d07bb64614660bd0ba39ae4eb4fc4dce289","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.47.2_1649691615054_0.6002405811599576","host":"s3://npm-registry-packages"}},"3.3.0":{"name":"@apollosproject/ui-onboarding","version":"3.3.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.3.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9a505f475b1f3a4964cbb5667760629b8d04a7fd","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.3.0.tgz","fileCount":94,"integrity":"sha512-id93kgvrhmfdv4h1YdlIWy9LprgEhroq1HNqaeodlfxjH25pRuAqC9/48DU9I7p0m5YhPyHFqVsnI2mXMWhUeg==","signatures":[{"sig":"MEUCIQComMPE2ngRukFN91xAAMpmPbWcwJ9lpVPfKQ3KCc2nZAIgNEUjegbk+0UhvRC/4s4oo43/mj728k3pK8DcveM8bFQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":975339,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiVHEkACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpYrxAAmdfD46qNqd2OiOOLu7UN+FXWTzQ5QGhajj9zxDGsalYqzjGD\r\n8opEV5vVKZIjZFtXLPe0pQYaP2wK9QX/ENGaPxapJRnqxsXaf81/cxsXYact\r\nXYggeciQ3i4p3rymy9h1IRzi9lXdj0WHbKr2Q+M87F4/ZOu4vCzMO3vaR6Ln\r\nVyuNH8DcgD4uBpjT1kT6XDM8mS4sFGW3du4e5PMEy8HV1IWtieI+avavnLqD\r\nEKg6t48tjRarC/q0qMZwec7SV7iD9Q16maJrFCfozwmD0BEWW7sCeyEH9vEE\r\nRBNmQ12ZAcJ5rvx700X0qw10AzCIWRaQyt04zr4MtfVeO3FBe7JEW5g+j8mz\r\ntJrq5zBwxix9JgoXqCogfqmHEgKcBKIvA+B5cYV1yM9+G4Y/Lev54mogOfAL\r\ndW07PF5dz3vpAsIr98rbBL1tzV9kpa7TN2HAzq8A4NqoeDs3/K+rQWTM7ASC\r\nisO+NUThMiBIyHvW/+b1edUvLpa8DdCMegpwnLYxSyXRDqbi79pZF/4now8y\r\nPPgahEFhOMRv1wscWG4NHfFsvmZHcGs59LnxKwpCrvUXYWX3vcstWkOIGTXZ\r\nAuJNPbziM65IkrD46ueU4vLaapNpGAEKHgZXgfZsvMmT8fegwzACOOOOVWY2\r\nkRoAj0IhdIWiJnm49OqvZ0t1YVY3OCJOCXI=\r\n=JHS2\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"3634e86212eaf479edb13393d228e0784330acad","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.3.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.3.0_1649701156483_0.41668528265182525","host":"s3://npm-registry-packages"}},"3.3.1-canary.2":{"name":"@apollosproject/ui-onboarding","version":"3.3.1-canary.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.3.1-canary.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1942c8dfaf041e316d624327969a7be953c10d29","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.3.1-canary.2.tgz","fileCount":94,"integrity":"sha512-x1gaRww4RxRVdFpn7jKqFi6j1wrQ/dbqiKWRpVv2tF/oBLM3ekrzUEHNysT+jwjn3EVYR6/vPt2bSN81Xz+n5w==","signatures":[{"sig":"MEUCIER+dLuzC4oYm1AUnoYuO0ubvbI6vbw4L9q1iqBYD9aGAiEAuDrJF9SPmXHjlJ/jsrNKtQzhzJti/82R84ew7nw0aHw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":975421,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiXa3wACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqF1w//YgOrfGXG/Y1/DWe2E7HakAP1ASZ+Hj6/eBUMvPkbJjFZ+ews\r\nQ8IHfxuGlmE/sMLoowezo35NAOviaO9MtdABxGSDbSY/hsrBMspt/3D3+MM2\r\npLGNxmAYO6gxF8qlRToCt0k9CjRRYCpOLG/AkWyWeEeMTxR8NWfunBjM5SS6\r\nerGoDNWscmb8d7/QoVbJq4PVxMZOM38ahGtix15XpGiA/62BIKeZTKyEfC+N\r\nrzcf5XmTz/EHIu7BgK9Lqq4xmDYbJpG4IEpHfWu0Avn4sdoIOQYzAbBqL+xW\r\nR/PH8mYGZ6eS1fRoODMrWRWa8pySfApOjoaHmRbd5oUzLbRPZvrsI1hcWme6\r\nKARjHfHP0ezypffeu/13IyCLVOEX5nqionbJ3v5Q3R2HpiGAbiGYAEqStfue\r\nFdDKaQGmHWok2Le+SAVaeV6APFwWKphFPE0ytsnI1detIIJj09qEw/z93uKy\r\nRoVlYEGsn54/1+Xe2qyEeUsc5DS57706erkKc1WwZ/xt8lUMFyNJBkNzhen6\r\n+v1d5RZqj+vjU+qtI4706vfDuA9l5G1BJWK3QCcydDUGbCmTRenocMoOwe4w\r\nAh4LqjpCI152KQvUBYrRrgqC1Ea2+iiI2UuKA0AJn/6vgiXp3R6lisMVJPNT\r\nJKNxK66sVxK00rUe4GGwkvmoPT1HhEMnH3k=\r\n=1J9o\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"12e3bd4e4541ab051823108576a617db346cc650","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.3.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.3.1-canary.2_1650306543788_0.3960516403052068","host":"s3://npm-registry-packages"}},"3.3.1-canary.4":{"name":"@apollosproject/ui-onboarding","version":"3.3.1-canary.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.3.1-canary.4","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"82c4a461cc5685611b2d992244f2c1d2e746bd48","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.3.1-canary.4.tgz","fileCount":94,"integrity":"sha512-iQ2B5OcpMYhtepUhqoMnxD1e7P4UPfXN+ExZ1PGFH+Toz47qREyaidOGQ1oyLCfxExzASapnkNAxRo+ezHK5Mg==","signatures":[{"sig":"MEUCIQChKPQSK4xnRzgyeIVlTpi2q+EMTBHaDjLJFTFxj3E/xgIgWxR4PlFjjcGUjnfXofEyXv7uHKpKf2aGufIx9z8yXPA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":975421,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiYcqvACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoqaQ//Zq2EFcLHoxpH6CIEpj0Y2199Dpe2ujERyU3MZHiFArO5eC5x\r\nKXN/1/lBZAMwCGmnRm0Txx28Pjw1jSpKESgrsbordSlY0hH/eHCRhrrhiJaj\r\ni5eFVKgd9qc21rtwalh4xvkUeK/r7vkRX/U1KCpJjxg4ZhuaH2/NhUrASlYH\r\nag7p4loQYa0yeTBPzP3wH8GDTvivCYFCT3aGnagMOQikiLMjw5lTkxQjgoRW\r\nGAgw91ExUdtZRRLnwlfh8Or8AS+Ur+bIR6nNL2Sj0d9E13RjscE9YpJ/x+Bv\r\n+rXPqQTm4huBt/uUy9von82W9EYD35ZOCCTuzifz5AKOzXUMEthYGibXWrc5\r\ng1pGp8idAjiYrDXWNTaF0qS3d0gzTW2TUVDV99bmqPGNz9Jx0yZy84zT7IzX\r\n7pnTaf0Rkh6h63ncgQ36Cpx/8IAG6hskHBwHrdp5euGF21o7Hqr0bdQ9+3m2\r\ni7kTNXEOgWMmDHHT4BEBmZ0HImhwZCwjP1FX/uZ7XJ5f2ZOmkGRegoDS9GJJ\r\nAuc5hhyQXnsCUZS4knUK/0BTfcnPRVaJAvSnuQka/7R7jE5C7aNGP3iisvLW\r\nxx+Rphoph/czdDRDCL80KcsK9rMg7lu7+HcyzF0U+Fia5Re85G11TsjKrKt4\r\nPW0vFriUwE0PULrcY/FtXQZlZxKF/Hqqty8=\r\n=k5RS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"73e6796eba6940c7275bc14389e1d36ee1f5fb3e","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.3.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.3.1-canary.4_1650576047554_0.11185915685361003","host":"s3://npm-registry-packages"}},"3.4.0":{"name":"@apollosproject/ui-onboarding","version":"3.4.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.4.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"bc9c324f1c472b2656c7d164c51980edccd9a245","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.4.0.tgz","fileCount":94,"integrity":"sha512-TkulhPk6agTU8+T/+WrJKJX8gT2DkqrINk0sJ9EFYsthSQn77+/07M8GlRx1lnTfgTs1r/w79Ir9BXUuwG4h3w==","signatures":[{"sig":"MEUCIQDYNl6o89QTqGjX/ij9H80nS/7x7P/pcMsjMI/EXFlG2AIgSl6GxoUCG+sHqCuW4P6cXBobCy8QkzFCttxkrFhynhg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":975574,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiZ+/pACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqv5g//QRF9EP7dPwLATZPUfLNKEq+LJjgrM9JveqSgTrLS5u1bEj5A\r\njO0oIU6c/zagfxma2426zTkXGIJIlVK7RkzmgPn0a/C0uSRX+vuAvBMuPpl6\r\ngjn7BhSSgdJgBq4DHu8KbpsOMZ1NMCIdJPAY0vyGwv509iqtjCSJXRW2HVbJ\r\na8MxuMx/+cIvjldOSVlySqS8oBn6OYeSvu5X5b3lTE+mYpkz3ela01R/q3qv\r\nLk+bZNMnyVQznKhADZbcEoUOxbpD+2oAqKaPXYYn4A2NFDsmzcbrY76BaprF\r\nElx7dQCdFw6W2bCuU0qqEYyGKPnYndAxMIa5214N0Vgx/K/zqcEi4KaUxJ6D\r\n6Fx5p5FL3+197j9vY1zxzTUcDFR4v1t5B0wd7SxxmPfDYJigGK/TpWCbp5og\r\nDkIMnl2RIwTQwZdsaPt+u5IR5HQhozLqumwvIxax3KxbaOIwU4b42ua+aVtB\r\nI/k1HKDcZGnwiXnt+BfL9I41W9+dwfVtpB9BIvrVa9pPfk9yC/WCnkKUJKzr\r\nazxeVgFuAJAnQB+ra5WZeTR4jAXn6X6DQewapK5Ahvic9SspfzWrUBpjwNqh\r\nUzmNljluEvQ6R8EqWYWWXxE9J5ZcV3jGtkbZKPbP/s503rNF4BIHvbLIfw2z\r\n8mrG2UwvYupW7x6cdIpjrmtETTLxMF14qPc=\r\n=CJse\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"d71c1fff75eb0f427344f5349280beb2012172e9","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.4.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.4.0_1650978793252_0.3359296513894954","host":"s3://npm-registry-packages"}},"3.4.1":{"name":"@apollosproject/ui-onboarding","version":"3.4.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.4.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4b39558cf21c5ef6fb5a1024281e490d8483b87f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.4.1.tgz","fileCount":94,"integrity":"sha512-3CllivlfqGcLJE2ZMwli4+Rnxz1vCE6TllyK/U7e6GSCsjHQjTmvxU/6T41pq3JGTh9N+e/URHJw72h0wzdBaQ==","signatures":[{"sig":"MEUCIQDDA/GDUX5wKEnGES0v/4cYyz6/bczVSTYU0yLDCZe0CwIgcRRfBgMu8Neu2DvtTnx9m+/SHTur8tyKm+m6uRJqtrk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":975747,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiaBVjACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoRBhAAok5GVSfGtO5s1QPEn0sdC7f7yA0Ikbb3fuXyjGxmT5ikPy44\r\nup4kWTYjw0898dWhJtbi0YUVSD2sQjwDtqWOuPF73W7nWxyLpOKaT6pnKcwZ\r\nuioDht4mr19avcf2i+7X9enDoegzPe1TjNo2NgBMMPQAWOtFa4TNwJyfG+PU\r\niAibxKERc+kuV8fNPcqhCgPbbTHPgrclB4+jgPzmQ0HeodCB8vEdhNQTFJeL\r\nywtpG94NbmkUXgO06HxeQdZP5I6yhKQWXlW7EqEdjgk3IuFVc2zTjzClpRdW\r\nyf5rlogxmAzf9SKu8JCCvwaRtVMpBqygpBuYm8B+Qlj9lluYA9Ezvn19iVjf\r\nB3uG9wWyI4eUjpkB83YXv+p+OaAYVqeo3iZW26bi8xJe2s4tYAycVZ+B7qh+\r\njS1MOZmimDhUdFdZjQC/zwbdDU+Hv1LTbC/h2bHurZvDfy2dY+s70DAzBMB+\r\nilL2vCiGVhLS3+u2NCfXInKvb4ssicu7xZTp3RxsdGy4rALNFewseqAp5u13\r\n0+jeVb9WIaAs7/AhrDcQAMtIKLdSZt2Xt9LnaK5agKUhwPV0w6S4ROwZeHfJ\r\noTmH3sGilbYxnPRv2+Em9a5L9gqj82711mt7cILlzuOx7Hy+aMp4sS7U8aKU\r\nonn8o7aL/MOC4LR01114R8/iLtSLv46JoqQ=\r\n=bcHQ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"c8ef8f756b5125c29e004ba61457f4c1e84f7b88","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.4.1","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.4.1_1650988387129_0.03377526003850195","host":"s3://npm-registry-packages"}},"3.4.2":{"name":"@apollosproject/ui-onboarding","version":"3.4.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.4.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9b3dbb8c548176c57482dee37e6a84aa7ebb1ad0","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.4.2.tgz","fileCount":94,"integrity":"sha512-1lppDllddt9KeuGMV7OTHp2Kd9ObJGTDTbPOWa/JZFPu0+PO1fHkVJBAOHKlWFVQflkCqJkGrqzpXGWwSd0Ocw==","signatures":[{"sig":"MEUCIEDSm2Wk6NTTigOyKJ12wym198o+XO/UQJa0RR4Rux98AiEA8+mZRpisnCcsUfFvK+JJdskXGzZPPWOsuuvZr8InfS4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":975920,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiaD0UACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqV5xAAjcTvvipBp93qTp202MnnGr3k4NrFgJJa3ycozoMGis7FQ3hB\r\nf3fq3lhkF+PBBEUroVacOTLdMrsEAGTP4ah6MjTEUFlCbgyRQ4j54I+kGCKZ\r\nzjbeqa2P+1JvaDPRWujyQnuPxp9f0l5lBb4eN8faFmWhQEOrh5SI6CfagbHr\r\nkWSoBbTEmuVDssq0zYwucfnikgjcJUYGaRQBbBAexHSXpl9nrtaiHtFKUrn8\r\nf7+k9LbMfMdh55WiLZp5C2MpZEzIr+viQVZd3lv/vSv25hKTvrE5UP8JnW2K\r\nzHjzZiAynGoC/Z5nvBGJiapw2Z4wGsJ5yfSEPiKev2u9qmnQHiHCeJux85ba\r\nisoLqlgObHAVhFJo6uGgLpCj7tWnu4APL5enUKAvqmDsrRpBHIa+h460adZ5\r\nB6BBAyF6as1uK41wyYW3FhREHdLObSl/n7pKtSJurxDh9njHSpaBdI8XaXmS\r\nWhAXLfJASbXvf88GiWVNqDRRrnwJxg4+/NzFHiohVKvQ0vLKRuiwCPhiY214\r\nTkQag/lKRHG0v6rfdsG/lSFCawVToLJXTS8FR1sFt3fVnHrFRaUFXw/7ts9d\r\nlpbVESOCjOqdwUNmHxTLzupE4akmXc+X5xt4D5w6QXsOSsntABdN1t2JSNCp\r\nY49TmbBH89AB84exlPN8UiqoQNZmHyzvOko=\r\n=FoWS\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"e0da929e06a64ee48e3af2f5a73884e65d2e0726","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.4.2","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.4.2_1650998548748_0.4562200116104034","host":"s3://npm-registry-packages"}},"3.5.0":{"name":"@apollosproject/ui-onboarding","version":"3.5.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.5.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"1e47894df7c5ab69e6ed2941c5e2ed522bc326b7","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.5.0.tgz","fileCount":94,"integrity":"sha512-aT7/zjgUVbxp9bTuFFrwAWJNRa0rC/1ZxxPCm8MTn9VSeFdoxwbBHzGEi8nJLMAfGKx/643onzjswxvCJ5CnVQ==","signatures":[{"sig":"MEUCIF1lLbwh6kTX8pZBjaqpRINfbobsigzbYOVmGpQmiEhsAiEAmxFNrRKofPtiiYxsv6mwlrVZhy0snpFBSRO4gugfbYE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":976092,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiapvUACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpRmQ//ZKXbCCBUtHK/BEkYamOtHKJm6rglxMJeq3UeU6o0srQ4w1oH\r\nmqWEhzmp8cdigHRFDH64x134qTTQwr/6nito4Ha5MCoRG1S1sKnkoIDXJ/NY\r\n1EkAxViM+LWdwDbv8MslBtBqFl5y6DqEBUCnxG+aUeCvWsk2q1pXkubTa7uq\r\nbMBTToZp3SkWY/x8/hGCO7nccP87TQu7eCZqQsen0gE0yK+TpTewAftov8h7\r\ndvgzORpZJ9xiTWfAZOGkKSUXCgLTmXzVicfme8cTpOTHXTE3XIzjqKfwgYVA\r\nS8uN7EgDiaz2Lu9dGe+neiQD51WknPaHJ1KpIv4n8eNSfyV55IxoQSlTenX4\r\nnTUD7joLvgx5JuGtIepHiDATijgr6ZAJpCkNStzymCvWMdvd9lCczqNf1MnH\r\nJQMLmj1BukVaaqTa2LySAkKQ1tjK+9uHKVprBEXhOC9KE+N/wCLL7NbF0Gme\r\nytt8PGYtjX+rYchF/kWbEmI4Ku9Ctp6fOhBll2zVVR69Fu5PjihXpR3Xge98\r\nBGEbxEGkOH/1CYwrGb+tEqrV814SU8rlx6ClsGlBdixBkslt5LPAf0F+wQjf\r\nCe37WRwjWZJEDgVvPHHCsoeZ5Y0W7ArYbLvX4wQuitPd7U4gfHea9ep14gKd\r\nOmIi+ufEt4bR/kTFgm2LbUaFx9VNtKPx654=\r\n=xLSM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"97410048dcabd77cfff747cbe19c807c04936fad","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.5.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.5.0_1651153876627_0.9600542311893219","host":"s3://npm-registry-packages"}},"3.5.1-canary.10":{"name":"@apollosproject/ui-onboarding","version":"3.5.1-canary.10","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.5.1-canary.10","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"69309d14558d1ba230df22db0e5efac7d3c6c93d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.5.1-canary.10.tgz","fileCount":94,"integrity":"sha512-wd6zLaf3Mshj1s1tX0dylZsHt2aZo7ZwueNejyUbiKAkyyX7V1LpXELePrm1c1whbJ/VeP6XTFW/HwozrDA3/g==","signatures":[{"sig":"MEQCIDhDhk9vFLtEfI9ElVN/FjU61byKq9FA5lABD84Z5EkeAiAp+v5aS9QT2OjSazsXzM7cWsDQeYJtCQN6jj87g6dHrA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":976112,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJidFMIACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqrRw//aAWjWIzYsazf1wcHtuaXiNj13BOMi0WP/bml4/9ABuFbu7vJ\r\ncGE3BMmr9WfYYUA8OTZpnwK0dRC3ATWciH7ZoR1PL/JWUN5XYO5MTUMLNts+\r\nbEpfW1ELEl3ACfhwrl8Rp8gH7KqwFHEreS8xuEKGjo8cFfS/VMtRXo3jASIW\r\nGWjmzEilM76I0RBq2z6bA/tQ+WEUKMRGsnJNadSp+V6l9Io3ncORdeOXJv2g\r\nfTZT+BbCrLIhs34iymu15/U9ZCqAWtRQyDfsUOiDwgr5uWrCOvBLCvRhz1TU\r\nFkYuJB3LkqRKHpCv1LNPjC5k9yHTSvoGe3OGsR/s15DF2wyEqYtfAmgUnS/+\r\n5OSxRMgBkQcMuqlt7yz6NZX6Yqpcv9MMeNel66EWMdNkFTX19BkwM+q/89fb\r\nUSoYz8zWw//lO4hbXoxQJqeOyQ1TTpiYXUrEHr2/8U+5AT+fJvFDbwwtco9Q\r\nuwnOMR1whRcM+Fqjv5gswf4dslBdk9d5MK/YbznRSj3bcY/jVCOFAMGINGIA\r\nsfNqRdA7cL9qRZqc84DXFj8aLj3iahJBD1U8021L+4lj+gxjggc2varar6BT\r\nr5W520/DTv2vAyDkW0vjKk0iTQTPCZAZuYwMbCQCIU/9Ti7bzt08jzpY6Lup\r\n8l/D1sdW2Ko49V1MjgxJyr/oS/ddOYIk7hM=\r\n=rjAA\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"91f0d07b38898a898f7d5cc3efb80652b8c8160c","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.5.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.5.1-canary.10_1651790600506_0.4007273553785464","host":"s3://npm-registry-packages"}},"3.6.0":{"name":"@apollosproject/ui-onboarding","version":"3.6.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.6.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"4dc0eb4c33bebb83364332e8169fbbaedeea7438","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.6.0.tgz","fileCount":94,"integrity":"sha512-pM/zRCxvJMapZj11HwVncPQVvIVof2QXHM4id3uey0u7DnRmB+4wwgJvGWeW9QZQyO3vTAwxIkcbnpR6ZgJwJA==","signatures":[{"sig":"MEYCIQCmSyBLmGF4d+vvMzIzHcTRAQPO3W9qe7V0J7mtLyW5zAIhAJD14wA4a+NxFlFkohFNnzSk4H3r8e9LNFxU6LVVajwp","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":976264,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJidFn3ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqISg/+LW7CO8Y5g/CTHkT78KQKGE4exEnhqA3U4En0my758rlpQNuv\r\nQvzByvq5Azj7mr8ScU14l889UkPOGSzyjZ7gbFjffuZD6MaduNFabo3+PVfA\r\n4/84u8vVOSQSc9B0DBiahlLHwH3XoBvx2DVb9zjf78j2LgYsqzdVWP25Aa+k\r\nYI0ulg05zU3iizefn48bOvY5pfm9m1+ZhDJPR2A7QD3Rzv0rfoCNokQPHiQS\r\n0Ga3sJZVvzGJISZT4Bew9rNF6jYbkodS3KOSJu4M+wFUEce+DZneWjnPlJjp\r\nE0uoUTXmVIVO5A8xAsOOZc17AyN6TYl58DJ5pzNhh/85a2nZeo/BDoN9J9rK\r\n/if/tM30l3h1BSQhViNsZbEeS7fMg2+wKv5uF4FYNjb8bGqLykH8tgDFhHdR\r\nClXquos5uCMhBrX7tpU+SEKNJTwB4InfEtLe3BVtz/BMGmkddjjiETcCGF6i\r\n+b3fE2H3rmfXS8+54RadrbAfWOr17x+1HMp442jPyaCLLkw2FY/9rI+m9rHg\r\nnbGpil8bDFqvyk7p6rkEWv6mQgoMyUjzAYJppNxqy2J5USQl7OOxVFA8qzYN\r\n0i5rUMRR5goSVZ8ZbAG/WxBvmfRLx9ulbYLnyywJDaZFIkQZ9QWD0QWBBwBz\r\nsCsx3nz4t2odHdpAIbvlbeZMc+7XvUtjMa4=\r\n=fhHT\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"809c73b34153147ceafb783ad0e55ce3023e2c3d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.6.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.6.0_1651792375101_0.33606900577201615","host":"s3://npm-registry-packages"}},"2.47.3":{"name":"@apollosproject/ui-onboarding","version":"2.47.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.47.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"9b1ef3b047d37f9aef1117bd4255f2307fe9b4f1","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.47.3.tgz","fileCount":87,"integrity":"sha512-nPOUhBiz/B8LDIu4Uz6wSivkP3f8vZpwz8EfQDNJIAl3tqp3jjNqzCSSXu5A9UJ41+M1/hpbClGYqOmOwwekhg==","signatures":[{"sig":"MEUCIQDbIJWvP2GLneByHQ0/mkExpDMtEQpXxZG4Wd9+0M1TGQIgCtb9Ll3xNjfx64Ew9AlK4PcLxQfOZKckQ2ST1I2Zizw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":963710,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJifABfACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpEGA/8CAgglSeAAUSgi7LBdkKsUZzF89hc96fAsRuA0kKchNuzSbVR\r\nFagHxi3fJwNOza0QGEDuRuaPMp8JvFxN7/JpEGCwOqI0GH/5iyFgQtH3ZSzI\r\nxAQjWrChUqNvJA45Ed1IvRSzZDEzg/M2TrkrZ4SR+5f2tIIme8rcVZB6qRMa\r\nQ6dDnEkA6eUj4zV2u516REU7xEfvM+iYZNmQQtJHzo3qc1p74CKyq0XFY50i\r\ngSxl3CZnC8QrsiF5CYSGZxYj+eE92OgJv8FCQ1YOH+idgUrYmpnunkqrBOtE\r\n6TzT16eKL3nCnSRpNFTNl9al1XD9Ku2AWfECt+wPRgslZXxECDHbxwQAHPS4\r\nHhyf3ebm8yQJOee4GL/xELcZDUM0NSOeFwbzb2+LSRaYynofc1mEYAyYP9kG\r\nDke7BcjpatQFq+0b0tbaeSf9okJAt9bi+W2gp79QkTAOnoSlyMgF8a9iLg9d\r\nNzDg9wpgPhGtm0FMkFaweVk5fmIjGKMeF8lBICoo9d1MHxTjbRFVv4+i+W5o\r\nJ018gaT4FTSxfphu5e8gJbw88lM+FlG0CV4Y2n4LPxK8krCvHh7oP7qldLe4\r\naOm9wab5oWfbZt6dhjCvxghGM7VY+SgVE4ogNJPKMAN6k9xdh0CBF6sHJBfZ\r\nkvvjd1lMt6wOJlbN/7T1FFTjAyQ+Ra7zonI=\r\n=/P1u\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"fc237fc60a4636ab94dc6fb9cdf03eeef1371014","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.1+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.47.3_1652293727696_0.5035008452796004","host":"s3://npm-registry-packages"}},"3.6.1-canary.7":{"name":"@apollosproject/ui-onboarding","version":"3.6.1-canary.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.6.1-canary.7","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"663eddd511df8500fd2df3d72f17f307731815d8","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.6.1-canary.7.tgz","fileCount":94,"integrity":"sha512-N3isY2dJtsFC9BM5eV/VFW6Chgt9V7+XtKkRZm2Ome8kdx/jxnWT8LqhHP5qQUl57VkDsP4QZPha+eIAPSbfNA==","signatures":[{"sig":"MEQCIGlg6zvNSiBMQMYzBUGSnzCoGpGfY8KsSpFoChDI3S+jAiAUqUaACEQUo37WFoHeTuXCcnF5t6vUJ31qcA76Vzi7og==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":976278,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJig6DAACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpnvRAAl3IODZAjddm3ex1H1tmY4fLrS9Qsrv3hqezW4TBraW2gosiR\r\ncjjWCi4+bZ5/GtVwLHM8jmW0wDG9D+KyrAJcI3zPg2m9BzgAXUQIT6npKaT9\r\neTkBQqiVzFs1EnXDcmnaeT9impaZgBqeEgaW3vkp988flMwZVbB8T+JOi5SK\r\n9Ug0xrsqspm/elIeeupfU16lkZ7LTojbEdYJrDZ41MAQy5OeOljgma1Z2Pgb\r\nuONAB7Fgg9t8fSenHlXe+ggvrPk6U401KCuufKPbsmU+joVas5JtCF1nW7PY\r\nuW1PX57ELizUl1yCZtSOwpWGh595SGtKKSUTuboPRxvX213Wna4hjmbPuPUV\r\nZLLc514+MbTMyr2uFeDmn/buNw4L0UIbXziA3cgtdMy/iez+El3lPIZdGPwI\r\nQZy/vmr8fpzvuAT0MqxcJYUwpC0NWPLvW2QbPAW0JloUsRitLj/DX6EkQn3K\r\nx5StCHGIXGTYv5XeYh7lMElFXwDBxzzcVNRD7aB3x7ZdLxReX7InFIoZ3Dzc\r\nJUIMVIy+ICNRj6mJkG+ROJRE6o8x2ckoKis5U/l7TDuD8HA5O6UPxy9+AgNl\r\nW1ChCAfcdiJw6u+xMzyofXcVfkuDkOdCIM5qwxBD+YtiRMMx4F6LUVrlz1yi\r\nZyuf1Lqo01UqNd2joQMGwFSreXxp3ln6Bfo=\r\n=GmhV\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"99cdbeec3fa24a15b208bd517044169bea663d56","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.2","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.6.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.6.1-canary.7_1652793536137_0.4835360919650806","host":"s3://npm-registry-packages"}},"3.6.1-canary.11":{"name":"@apollosproject/ui-onboarding","version":"3.6.1-canary.11","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.6.1-canary.11","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ca66a86fc0dddb5964113f3c9a87bafb00bd9bb3","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.6.1-canary.11.tgz","fileCount":94,"integrity":"sha512-9ATkJ33L/Tkzfl/DVHezMAvDLfhiYR2tz9Ztk4TJ5DevOFqA15RLuJQ7VoiBZD7MNx18RlcdR+yEc6xirk0wQw==","signatures":[{"sig":"MEUCIF4SgH7p4RgWQQRUBp2hT1z7J35Ngm4JQ0NNSXOmhroXAiEAvljEmvP8bUjXKHKY4SaJdV3/8gPkClXrDSRV9v8pCKA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":976361,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJig/+VACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqi8g//RmC3tlupIe3WD5uG+kt6dKRsChZqznPGJiaysKXPJnPUctB+\r\nIqi8ZPiAx6CzTqeaDupES1UxaVUBwcIscqUxurblaBYsgubrrLkzTeZZDdPm\r\nBDI36VBtjn7QiE8kbtfcHVx8nfxQbZufmFm3g4Hqq18PI48dBFAwE6YYJXOH\r\nwTM2T+nO3nBaHDSkxUmqMotxtVDyaV7j60Z7RcfT+Bfy2tdig8myuqel21bD\r\nUyBmqYm2u8Osx+emeDoe0df7pJhiRd2xUuEXQ7XqaCF1T7xfFK0hX2xUQgxu\r\nRCK4bRLEh0KnL+ztx+x9nXJ+UVGHGGgm3z4Y8zQz4x6b+6JmWbiCLWXUD/7P\r\nPwdDa4WTd4FSf4gx/MxpJxieGUBIsa5+FgLNf/ZdD+n1+SHINwQ8p5vi4HpZ\r\nhXXMhDURP3awD+t2g88fyikZAVTTagUCagruoNlLvWOV/8CIkhkQ4vsjA6nV\r\nPhTsFJevXTnhQfyg0/t2yKpgg+2R8jFMi1fRpVatbIzilrPmvVFRr4h7YEpc\r\nmPPug4kZwb/84SQ/6rBgYQdGhMJXNldCCNR8eVEgNZZ6lPPA/qrFhfjLtKBi\r\nQ5VA3Ilx2TWF5LrTfzKc/yBimq1LZ8rUt2nV8GXG91V47cTlU2alMUQ+wwSr\r\nX4OFlnb7lnFpmqiJP3g0ydzLmzzXgIN9+HQ=\r\n=5K2U\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"4739ad1d75e1104518b2ddb1a153878c53e24a59","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.2","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.6.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.6.1-canary.11_1652817813349_0.6259054310336869","host":"s3://npm-registry-packages"}},"3.7.0":{"name":"@apollosproject/ui-onboarding","version":"3.7.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.7.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a6117305f07d8383b1e95ddb03623a077e6d906a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.7.0.tgz","fileCount":94,"integrity":"sha512-yyPutdngYl67hpcuOrU5EJ1nHlnAgTGFYSBAUJZpSGduaoXmVLhdsGscFXLyr/U/N0Pu8ImFeSH4Y1axZde+KA==","signatures":[{"sig":"MEUCIQCyw2bnbKsxWbBvR/lexvy3DMSnPSjgnhv6NRgHB2BXWgIgEF01m0TKK2bNyqldKwXZIKelpTmZt8olJYVg42Wl5ZE=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":976513,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJijOsRACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoWAQ//T4d+bcoW4M7m3ozNs3ypqmCzkJoB7OUFSn545Vua3d9PAwPz\r\nB7jYZsqR5sIlqsvRT7CMM8Wigxkynh5khxLX4rcNaFFgENl/4jAnV9T1ZmfC\r\n2yp8d3pEhtMw6APip9DS0WTpbHG3hHZuAM15/6agNJJTxlCDBydGOdrrFNaw\r\nvBhsEBG3xW01QJaR/jwVh+n3B4yYe56AI2LuTfP8DodUxAVEFbq3hycAfCLc\r\nGT4IT+k8atafo6s+vjh5UIVhK4giLvetTyoao2Bwf938z+vUcckpimzUy+RM\r\n3U3tAE3IHfyc5pb2kZJYNLi35u70VkbjgvOl2vkMhbuViItKIghqAUsb0Hq/\r\nTG9u5/kPIc1vO/uCuIMbMvkk/4asgTbBewEQQtUqMamfk1LIpDndunafI30c\r\nxkbf8Qxpt08qotCNSS+4y7Wx1qe9ZHHQTuuVLURU4JTaJIlZipFx1VfM31BS\r\nND7BLTnZudIli30QnV+snCE5Qyp7ldRgbE46bQ2EwYjNvTUpyFYEAOWVAOX1\r\nOja34DbzTFIq/7gm2wFBhqqLXIpDj1QDO8XQI9Euc8wz6bM6Tf4yH0bFwtQe\r\nAFgGn+jg3Leq7yDWFd7wwWNNBueokngaDQ2E4KAa1HTnk7hfk4dxklkB0xD4\r\n33ZWGr90hfVA3OwqxjlLtb1eiCSp/PK1Pbg=\r\n=stzw\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"248e63881e37e88b4a59ada7dfb52b6b2665993b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.2+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.2","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.7.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.7.0_1653402384928_0.24625838972707847","host":"s3://npm-registry-packages"}},"3.8.0":{"name":"@apollosproject/ui-onboarding","version":"3.8.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.8.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"3b440cf34a35c2e179bb0cfef519d90bc799f05a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.8.0.tgz","fileCount":94,"integrity":"sha512-f33RGCUeld9fkGChWHQbyVNO6RHlvKpYe4Z+yM4dP9FQYO8G8n2ZaQGLoc4qrtqzYUZr9ZfqZtrMhKYlVGMXUA==","signatures":[{"sig":"MEYCIQCNT4vd/z+KnFPWBdD3IY2NGDvXB6ZsQBBmzjy2GJpOwQIhAMHx9MZk22fMjwjrUnY3ZUJblkM2ujQ+2866iVteEzXY","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":976685,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJimMxmACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq++w/9H+qMnRZsnTtVc5vvlH+t1HRvglNRdNf+ccmqTA/eETLVcIRI\r\nPbBI5pUch3Qhq3CD+qytQfl7FQxp6RVPiSI9NrLYwpNj5BlvETlVU+FUDTPf\r\nUk+hIqsijMgO350H0h/FBZ14eE8YO52tkMg09y5qbXkKYpPQpcMjPa2QCts6\r\n3EV3IJSC9Z/K7ZItSGFfGDyRlZ9+GroOmlsj/TKIqaxBa9oYBOVUCgax4EYA\r\nVwapzT7lzT1ZmjaMtKXgefsIch81DYORKpiMGPRhf/ZZFYC+vUd18NXlpxgH\r\njr4OAzdXOrCjSk3Ptg1fa3NocaND8t3vj5LMwRSbK3WXG8saOghMPD/Bkhtj\r\n/TQjiCxsNUvRaHNY7BmAb5v2fJz2KKiYyV04l0TfX9WQ7bVGRkRhXrfZpxDJ\r\nwai2tIoFl3ikpJd8CsQqgZdgKZkaTieql5Ze+bB5AV4b3re90e9OLHJucY2c\r\nNiIa0IIGU16UaRVPug5DHarYMt/VjVIXnb9oUzdIjQveDGzLXs1Xke4i6WD+\r\nA7IsLnn/bMdzYYCnCC0hzqjQuHDpFbWFnbNZO+HaNgsba7WICLiUsGa7LAsM\r\nR8+3BS5zmPg4fWZTZ3/s0Kd1rsA5C3Qj5WVssEmzQE5FhzVtEZI7B+AC9PnH\r\n27Q2JeOOSuQMz29iNRwilIgcJLl2p39b4c0=\r\n=4MAs\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"46e4cf26c1bf7e2b8f7e0f92f2b55ccbb12c324b","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.3","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.8.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.8.0_1654180965832_0.8183932598777723","host":"s3://npm-registry-packages"}},"3.8.1-canary.3":{"name":"@apollosproject/ui-onboarding","version":"3.8.1-canary.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.8.1-canary.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"b51961691bd19b8b9ae160cac367de651f40d297","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.8.1-canary.3.tgz","fileCount":94,"integrity":"sha512-XPH4GQC8I5mPM5mI8kNMCtCxk9EYh9QRHSUxqnHoc4FRKC4N0MldVfEEtH0lO21E8l6zxVgwhu3lalS1ZqnvgA==","signatures":[{"sig":"MEQCICzk1k865JQ19s6YfDc8190HoTBDhJ6ZLeWajMJb/2KpAiBDJ0RaboySz/4xuZFSUsHk8Rx0NJaEJvdlG+B7WNCkBA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":976723,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJioJcrACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoRVw//ZoCs6FDNf+0b6UiD5Mlf6CdFJmgw0NuBJnOC4ptUYET5ZPuA\r\nznqEEGJsaFEiJgQdc8i7Kjqo/DSP4i5KSzppf0y8+ueNTT7A8UaZfxYR4VYg\r\nxrTRJaGB7z6pPkJofowPvO1MK9t9DsNpgxRBZsO+jsKxEgPufJI1G5ajHvqK\r\nkl+7KC3szB+cNqJWZ7+OHJMgbKLqbJWNqI05CbSrUoEen2H2go+Z17eNs7o4\r\npJIdH8suGrBQmlGsRhUk2iDt8r07VxJTRJz66716E5zdITXnao8iYQ42h+hj\r\n95UK86pGo1HM+RDPk9ha7sHRvq1Fy+0tvRSw1wJ4zusLj5DwYOFj0gtxeZ7c\r\n4uWfCgH1F3xwxCwstpeHXbwtABay/FWJWUoWwtuOjk6KLtRcJ9QMhD/kZ/On\r\nTLc4iUqREMmnlbbqMKfHhC8fFJXrEKWor3EtOVKuZJJZwCCIk6dBofjc08AL\r\nkg2MoWRp9012wrzEei/bbUfgJUXOsAjK7RhqP/vOiwp1e0/PiZpYSqn+JvPz\r\nWPqgwYvdfqtKaiRgBVTeW19CAWuiRNNjzQWsA9kShHKQc2mmTL1E7/rkKcLo\r\nf9IAKSj1k/NwSGFOVatM3Jm8P/plPOr+4YbzLAZRo9T7hX27+ZS0mPG5h3wx\r\nSlDvtNb/9JlWLfQ4lKmWkER9WguA/66qAfc=\r\n=cAB5\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"67fb8d342e3559bfb0d6ea9a4f4b63359bc85c9f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.3","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.8.1-canary.3+67fb8d342","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.8.1-canary.3_1654691627496_0.2489662410303175","host":"s3://npm-registry-packages"}},"3.9.0":{"name":"@apollosproject/ui-onboarding","version":"3.9.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.9.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"7ff26c7a6981f36dbd74a22ca76c0e092c5523fe","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.9.0.tgz","fileCount":94,"integrity":"sha512-p2Uxnvtj7+stb9Dz5YoiHQpWGxGw6duLsBoBnCv5qf51f7WN7xE8ViY4t8K68Zntdm0R86NVjUvyYpHbKJnY0A==","signatures":[{"sig":"MEUCIQC17tgIOfqI47o9j9Cj8OyJ+T6OYCm5qdnColxyWHHy7gIgRUVI1w/l4s1oGJyFBHrDJqsVYKwbBjf42FyG3LUyP+g=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":976857,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJioPpyACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqZ1Q/+IbQGZf8EX9EGTvdmFzMmv1R4B+MxI3hEskWzcTyfvxJf7/4/\r\ngiled/tf1xkbGCRyGTq+kFGd399Xir17Q690KXtK9xGtjjM58dxTH/RI8gN1\r\nyCMF9b+uBuxsIrQzgDyEON4E09YTPoSsslpBNdWVF1Batf/xwoYKvCQVPNha\r\n9uIObrghb+oIwqid5r8ycVzilHz0TTRDMeFHzKs5p+wf8gLRXKbtI7VP5CL4\r\n3Hj5o4/xZAwWhPQ3oyqdUqqKvR3r9nfwWE/wq25pDZm1hnPE7f717R+qU3WV\r\nF14luKkQs65b/BhH4KVsGvnLv4a2D0WHtBlN6QxVvQ5X8Dt5XJtEyQLF2xNP\r\n0f7hPH+ulCw/CPlM+CqJrZnvS0/1qarUbIBf4IvVrcdIY5WTonu9T1L+faQv\r\nHppKR3zU+Y0BPMlSHibQi0auKXVez2vW39sVoGBIYGlW17I6NH605Dtgcecs\r\nxNv7YRZrMEK16VnXknrlzL+jmXGUOxA/qEeLQvPXAEMIefrhMFI5JgDmqyvX\r\njSb3ohjy9K5K45PM/zIroO5oHdzHTjwvB1uywmvOee3LuxgxtTqp6dG2Tl6a\r\nCtTv85+5+GbLeH2UHMmi94favWNxzGizJzNshd/nEVcmSxRRk3oW2pl/TpRp\r\nmAjpBQmjewfd2zjaC+gARAKDHjEPVluI0Po=\r\n=wqXF\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"37ce0730a04069f4eac32aa2c2537a717a5bda15","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.3","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.9.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.9.0_1654717042078_0.0805953990206345","host":"s3://npm-registry-packages"}},"2.47.4":{"name":"@apollosproject/ui-onboarding","version":"2.47.4","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.47.4","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"d1d8cc36c3aa2dac4703a1deb5b46a8117f77a02","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.47.4.tgz","fileCount":87,"integrity":"sha512-BmJeIUvv1Lqc5txpxwefDZeS2B1MR2CdEzWvF5Lgo4RuDt8Ude8oe3Yks5G84f8t4uoY9F/2uNe/vMaLd6mX5w==","signatures":[{"sig":"MEUCIQCganu8Hrh7jnGFMQNV1/SsnZ3QxNRwfJ3McFtNIi6j9wIgATiwyahzweqEWFjAsavoDTe04Y2JwTNEylWicVC0Uvk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":963886,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJioUtRACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqKWw//T6FgztcorWLPfzjeo6biwbZ72a4KO4or8CXHOBdWdm2lHfgO\r\nPMGyNVunw6tkLxrK8OSZ2jiPh3/BMQZ91t/6YOOMWkhmYnny6UZrQFj6Cs0M\r\nitgRiNZxqhRA0Gu9dtI2U8+Psc/kazovKOkCrpa57YbYMrEetswbC7qBhFU0\r\na5x0FvAuB/LVrU9rxgSO2JFneRMWMVWkqbhfwaEpnVOd8jgePSrxTjDKbFht\r\nwq6TJJSzavTyzDD0ZErcTWI1aJd7pTMGhLG8pM1XHaHZ/bFVgRRumk0yn25Z\r\nV2JuEJCLbG3z9WgXHZjBFkxqn3fsxUavmBJoa2NWWUXBsAWYe+a6WUim3wDv\r\nrnogIJwXdzibYJIFZpzLlSH5n9nye1SnUOHHSDuZvSWhqE+p7nN6h9bpEuOG\r\n2PJSbGm7xjEBCkC64XKGVD9E67MH5hXxhlu9ma5GecXT7DL0e4TIl1nUlPTJ\r\nDi2mMHNAZgLmpx2F6F431BYH8gBt0zRWK77eHHYiDEfE42UIT/12TnDLoZ8j\r\nAW2t4sO/3zvRq/pEuO5WB1XIaesxGw5LhQawIR3GcWrlz8x5Jqy6AR36NMP2\r\nGbHgji0gBOPrBSTiVmTOXtL3g+EPhnrFprtzcaZaBrHv6NuQoN0nHynAbn4g\r\nCw187/T4ejz/z0I4rmZzTCORw7xYXYmk/8I=\r\n=0Mai\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"6b5320dd89d0a1a28538717c369f7b7cc6e8dfee","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.3","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.47.4_1654737745270_0.2826218216626286","host":"s3://npm-registry-packages"}},"2.47.5":{"name":"@apollosproject/ui-onboarding","version":"2.47.5","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.47.5","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"afb7697f3e5945cc3399a1682757c789a21819a9","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.47.5.tgz","fileCount":87,"integrity":"sha512-imx/A4F+7R53OtMbmFLEHW33Mn96O2g93vIcYy9ATN9qU+9Jk+dq/Ffv0dqioJR4j78Yzvcpu8UpXAXqLVnuTA==","signatures":[{"sig":"MEYCIQCu+8EkMpcj6sYlppr1dfIUBgk2o2EYMWv3ZRn4ZaYJ2AIhALNQ/t5qmIrb3jfuvA3B2f1aPkMm7MNWlhNBGLWq2K4m","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":964062,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJio37SACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpQiQ/+LQUNtu7JHRZUxv0w5mwgSSt4hgooBc246wli22RnKKTbS0Om\r\ng9vSS+9L3BsmU/T0yufkIAEn7u4nb/tKPeglSutKtmpj1W7zJHgkN9UNIXKW\r\njMz0PolvOvc6pdZ/k9k/dOz5mPa8Zb7o6ysbl9dGNPvTGnnZ5XiZgVPH/Tbe\r\ncaziGWDJiZ24beuXal+uZj9eADATcLd7nO1vha3Ng5eqyAj0eJvPC5X7NOvB\r\nzJONdfjfOoS3SUlKZ2B+JtPvGRNXhlPdagMmAKem1UAx64gXZrEwIfvoikww\r\njp+8g3GnXhFydlc72ib1RyfAw9lWDKUdWMVosY9NHwyj1PkGD8F991dSDPtt\r\naFx1dLQjitvvNGXo377041FBTNKCay+L8F7xPCUipvCqTYmvDkw0D9oUEXYb\r\n3j+FLKJp37e3tKAm9SQgHGbFXhwvMn9fwd3nOcXd9QSywQdALNKGnk105Tje\r\nG0NJYE0vdAFGRoWvFpQJAyf4vvof9cybunwnze/UVcHGvlMTsjh/8uCylICq\r\nQp4LF2Fpq6TFTsmO/u1elB6gyym1SixkzTItXudI7n2mL15xhKwzc7sx7wub\r\nQdCICfOmAkISUCSpAJ31Rt0qIVEG3Z85b7wIyyrxtFA2yP0nkLvQX9Bhpt9l\r\nOOQuyWQeeThCbuqUwlsCVPyK+3kNtylf2eI=\r\n=kmDu\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"6e3aac319270138bcc2e1ac5b0f0a866c16ab62f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.3","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.47.5_1654882001950_0.03686502057258911","host":"s3://npm-registry-packages"}},"3.9.1-canary.7":{"name":"@apollosproject/ui-onboarding","version":"3.9.1-canary.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.9.1-canary.7","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"82e3b5344f159861343f10ef16c410e05e1abc9a","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.9.1-canary.7.tgz","fileCount":94,"integrity":"sha512-+y9ol68QfDSy7IN4qcppiPRgbPuFHwOibB8Bn6TgBkC8JMHADkq5PrWVm5f3X9vj/kPd/diGZqqMHLw/7HMgvQ==","signatures":[{"sig":"MEUCIFqytKnqkK1s4b+J2i9HFYiRLP2V/avlKwSOF/kpHG0XAiEAz3+Kod96X49bEM0OZoF3GfVMHmN4RBY9FFwpxftykFI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":977092,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiqNtZACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoepxAAoJaUvCaDhlGDcclBPC6rLrWtR6hL5nSQwyT+f9LGJQjUME8W\r\nowvFxE4RCPjnAp1Ljlmhh1A35FGhDgLJ8yacT8tK/FdK8eytU64BVNpIAQ4p\r\nyV5yv7arkWpC51ZpAvQNDDXsZghsMsZ8P/aeP0k9uxC5zknMaoikSmV6wbCR\r\nN0p5eqf9/eeCpSMQLSdUDcqDHKq7fayQr8jYcQeIllmEd8ww0iEP8O4Zilqp\r\nqAvf2GCSea6My3na19x/tSkiuzF4OHMtyhXIoBJX4e7rrfmbH6bqKPOCrVJP\r\n9Hcb+tB+tuhlUXXieXEsLSMzvHDXgcIRrq3/IdBBGx68d3g/4Ks8uOnX5T5f\r\n8SRFSTnuhaCJEyHHyx3eJgzNw2DK0mQ/F7vEjKZEci+96rDI5O46MsWFSDrI\r\nra8s4UXP+yhs5kbgxVaVJaFKvUprtCO8WQn2hJc+scaT6p7A0YKxpfcpoA3z\r\nZfDo1vb0AgM1lQMqXMR7FzOPAJEHlOqxmK6ma+uQnr9D8vtA/k8y9o7xMhit\r\nKK43xnlaPTnL3JouwWRpTY7BqRem7wkCadhgUbi3GuKJSGsVYEI+8CNHRX1L\r\nud/CD2rprmc3UxK+cH8Fxwi8nE5YUy6Kk+7Gtb7ywxD7wXh9pgg/d2lXQ9TI\r\ndbxqiZjnUxgIki1JwvOj8Xt25h09Zq4KSCc=\r\n=3LvU\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"1b6667797638703e69b87f4a4e807ee5218b150f","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.3","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.9.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.9.1-canary.7_1655233369147_0.8275761747716066","host":"s3://npm-registry-packages"}},"3.9.1-canary.21":{"name":"@apollosproject/ui-onboarding","version":"3.9.1-canary.21","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.9.1-canary.21","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a172916bde75c7dd5c103b9e409936b5e0a8ec12","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.9.1-canary.21.tgz","fileCount":96,"integrity":"sha512-vLWb/niv5X2ROiInLVMqPArWuMHSbcoLHuQyfTFtbRwv4Za+SJ300sCKHB7ZrWiYQ8rNYSR2zGfKtmnvPyBOuw==","signatures":[{"sig":"MEQCIDiD0zFh3UN3ptFxEZaB1gkHLtjA25/tptf64pqC2Dl/AiAMzg9CAktbT+iXmKIXyx+CzAXC+gPEfNdbgH3RcAciuw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":1376436,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJisNMwACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmon5hAAjRa0v+oio0cskPprmMh6v5OX98mwk2fuHNoGEnJuYha6w9sC\r\n85+CpvaKzqlNNMzFlwD/oGYivKZPpqGlWtPEMbr+0eZNi6Yp8fhNvoWxQFiD\r\n9uTnaxZdfN8ztSrTSe9nCo/6E5VSiM0o8sSoMK+ksooUUKZczCUxBKTN0hn/\r\n1z4Nynp8FSODY51hzkqweHDBEasTZ8QTdAv/DQ5x/GIIoniUr5xoFMH+OivZ\r\nF5riApbPz+AC0l+hnxfwC8fIUXbmj45SdJs4kRpH0veT24nTSJm+Kg/tfIWN\r\nZaGmlwYa+K8+PFljWV4EbTxaU3y2Cz8NXtT3mpt29b4/PQJoI/5dfYMQBQ1v\r\nBateNvJKHWjaUVjYL2E41+w/0lyOuXZeGS5RSwAWTWHl3gvE5VGd6mnDzwe5\r\nd+OQ1RRJUScq8Jns/CyhClbFxWuWVwTdlAJeKivUnV+bgWE8zNulv0PlIw/k\r\nKtTBXdYIVhKfO6vxvkUfQUOcjw9E97SmVsv7WhQGfQJ5ZIn0W5TuH4yd3HCR\r\n6Ob98EzyflwrYh4ICCKgvR1CNGq3HzR5TfoYG9OYLLs2rFKJQCwNmeklS0CY\r\nQq/uUPMBbIyuKauFdi8Dp8/ON8kgZr3e7aMLWLCmnZ4KOayIDw3OufqtYZQI\r\nlyY/WnBm4f+74F3vCz0yrS8+yL2DMWWQYDE=\r\n=CW/o\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"e961ef7b7867fff48ebcc606c5bddd27f165ace0","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.3","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.9.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.9.1-canary.21_1655755568330_0.1770864422345828","host":"s3://npm-registry-packages"}},"3.9.1-canary.24":{"name":"@apollosproject/ui-onboarding","version":"3.9.1-canary.24","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.9.1-canary.24","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2dd0f9a797b58c6a3cc4fa3ab414d421611581f4","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.9.1-canary.24.tgz","fileCount":96,"integrity":"sha512-gCMriMk/g82khH7Rvt6d1pCCzoLaZd9gmPULIyiC2lacNf+IHzsoeR8vhBkaF04QN8Q0779LnT3ic4khy6npmw==","signatures":[{"sig":"MEUCIGDFyq0pMKkX8fBCqOylyTmY0aMh/jjIEvACCYnxE12/AiEAgtdtAGjsjMYiQjYqHPJw9ZIa4+Cy5rDKCzzjMBJgu5c=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":1376478,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiuxIjACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmozJhAAitKrnSV5VGwd6w8YDx3LxGwDrngdTDPAw3M/kG7BV66fvqBY\r\nT3o0UNGdyl1i1NI8tPZRMVSkdPW6i6T4e9rMrYDbMeklk8ZalEZIY+5ioIgz\r\noqEEGkmHILgDM2GktnVRz5EUwmRFLaDIu8aGkIYa58m3xF+I3lYSQcJv6jKy\r\nQG0zF4xNCWGzPuOAFgvPOCNTId20OvVDzdj4KplKExSBqPWVQWIIBSI1pIJ1\r\nIRZe2SP1mddwhF7qoqtgHoqNyaHBAAm/ssNqjro6sYdrqCFpKpf7Lu2NGffE\r\nLS2vbUvfJz/hEUHLaBpPZx+sAombE+YEVD44bL1DQIiSSH9nm+kfv4H2Ay8h\r\n1nL3cZ8qQupl0oA8Lu6VrhOGKgdS5J3yjsUeNu/qHWgvRmtccx1y7R7KjjUj\r\n4UXfS6aTj6CRz8yBBY8+3GJRbEoyAkvjA/2da4lA54UJfCn1w0KyO/8q5Jy6\r\nbkgbC46u7cFwptLJDf2NwyCUQ3JqsslEFd2atjphCYQdtcHmb2ntuLO++PMa\r\nVi5iSOks1KaGp26RbR9L1GWUVHBWsoFn+MJYxO8U6KfPn2bAS4m8LTJ0MZG0\r\n9DSUpZwyCvmx2RYlKWdgK00iLm6w463znOm/XhJqLSw5JqzLRjx2EgZwAm3Z\r\nW/zhnKFMJV6GvLN4ZhBiMzHwXecdRHt7U4g=\r\n=ewIn\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"ffccb486e1e89fc83f62be57353b68c234de88ef","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.3","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.9.1-canary.24+ffccb486e","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.9.1-canary.24_1656427043700_0.7606761298809626","host":"s3://npm-registry-packages"}},"4.1.0":{"name":"@apollosproject/ui-onboarding","version":"4.1.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@4.1.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"051a5245865e91585957322bdad7284f1eb51830","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-4.1.0.tgz","fileCount":96,"integrity":"sha512-MCRcXRFPqPStk8/0pWYeVw7lmHTYUonMafwT1Yq3IN7tx+cgbNPIX5tD9AioyvTKV70GwzyhP1nZedPu/Qj4kg==","signatures":[{"sig":"MEUCIQDl8OmI710IjnLTDfWV6+7KmpcrmZy8viUqGByVjHa7JQIgQO+th9xCqSCiZdzJ9M8iWHurzHSRgBB7L1r+Ek9rS+w=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":1377928,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiu4+2ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrYBhAAjo9ZILo37o2PkV+t9d48S5ahb9n34W3YB/moQtzMWLAXBrXm\r\ntzc0z34N+koNqayhu3fax3ZMwu8BU9OXywSE/Lp6G8ycgMR38Iy7uCLZoYtP\r\nsIGUy+OfRsE8QnSbQDVkE9x/zK7m0gi73ExkutfozmwSrE2WRyT3sE/IvZFQ\r\n5UrjQQvht8m4BIeUsJ4iT9PVifqq4uQ5PRYytrMk9j6/qZqZblx6ZCOviiJ5\r\nXfnXUM90JzyhcEvy/eaUE3sKU4WCgqq/pFcuoMiy7p8gbUf+Q9pT6X1Vh1UH\r\nHb4GIqy9YqGODnw7ff+zOTPby/hqlOXX+IBiorAtUv8EL1zntuY0ktEx6PtS\r\nxSIYcDaKsSJQA1cQheenuNCAralELFTJ/SveBuBfzOhImI6sK8RmyO77ReGl\r\nV6km+RuSstkroOQqs+lykuwBNqD/XMTBRVA+wQdQnODy40WOOX77Z/L01FqG\r\nac9Qyc7Ena97hVo+qcCBo40z4C5u39pEA/WogkV8mW9I/yYupiJ1PnOMZiju\r\n2iEvdxFPw51I4MzwqeMeJv2mxX1gzxHz1CJwZA8XhhxwkldrjPniUTCX5tGL\r\nFHIi6ALNfKd2DTK8lkQrs/pGSYznSftkYtKS3bozR/OHdAz/8UJuO+RiXd+q\r\nFLVw3bBqFGauWt+jAZAdbhIJUVV+bBUDcK8=\r\n=JLbt\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","engines":{"node":">=14"},"gitHead":"60aea624e47c54afcf2a627d8ce92d608c169742","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.1","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^4.1.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_4.1.0_1656459190777_0.5943830397981869","host":"s3://npm-registry-packages"}},"2.47.6":{"name":"@apollosproject/ui-onboarding","version":"2.47.6","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.47.6","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"ec18c1c1052654cda58eec026cf436d6dd9ba575","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.47.6.tgz","fileCount":87,"integrity":"sha512-Zk3kJP+Y4JrlbaqDFRsa87uI2Dle3Tv3pu/4kkzm2VteDQ3Tob+MZ71wSNjODwQpTBYmsxcMQoemyL78B2CNMA==","signatures":[{"sig":"MEUCIDZd+J/E7bf/CpddndWu6mRcS++28OipIlv4dhAFkzB6AiEAgvOtihZhblfOwRHddQm4eiCxuA380DZ/PtONwIge4RQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":964238,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJixuV4ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmonyQ//V5dNFZk/NJZTEol4wXZYgCRND4Lq6UlGrHD9OLfGHhZaj4m8\r\nvLlFqeqhyBZO8nbs0eJSMy/htCoRhpDxUtfSoaEJ8eeH73lvoGLkfCmYmE4a\r\nsqk9gUpQdtrHT5wJMBEgOgNrPUsy2WI8wgVu6aUXfamtlRsUElo/2rO19C0z\r\njebMQy0L43rUEwEqTvayqBLffUzt7l46wcKaP09UokoCd2OIglskWO5pGfqu\r\nKukBFXBgeELBlHpPIgd3IgtVe4COquyO/p28wWWbKFTs9tnYg5DZOIFr3geu\r\n8RkePYd0thKXHjzHReXd2sdMfQKnSFIaiDqzDZktOTlitPR81LhgiUD782+p\r\nBtQvpmQ2S7tQBj8FjHAdALNkaHd4f5L6O8QEymTsOgEIg3s4gYVYAMNHuJFu\r\ndZY78H8gEsES3S4Eocr4ZyxuTez1skW4n/KLh0RSVs7EOtNsN8Bm0y+hUyFw\r\nsm641c748MmFqlGVjOPKh5GbAIYEW1WCmwwZwtEn9PRZSsDRWX13Tj3mM9RS\r\n6rW6HPDoDzLRAcmWWPpuEX5t9Sdf8lU8fMt1pqLXndugijSMl1CGJoBBJY0Z\r\nNjFlfeTEt0SHnNVpsLF8XqrwihgG2u/TQrDR8tJdRUD9M/Y9jX1UoMphwRUR\r\nz6YnosMdNz5ezQcLcWCm7o7LDy5/+kBFyKQ=\r\n=ayBQ\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"a003460491c6701bc0c5180dc27f0fe27a37c9ce","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.19.3+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.19.3","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.47.6_1657202040288_0.709348041364849","host":"s3://npm-registry-packages"}},"3.10.0":{"name":"@apollosproject/ui-onboarding","version":"3.10.0","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.10.0","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"2d564364957658deddcc4b7891f50368c32d5c9d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.10.0.tgz","fileCount":96,"integrity":"sha512-cSCVj64hwjKWEh2RhfEumjLx22yF2wH1DPcMMtq0mzNyac6LHrg6v4HqGaqPoNQ07qHd3w5NP8otzO5oKpYqbQ==","signatures":[{"sig":"MEUCIQCFpe/SaFN+LaZuoJPF5NCiUkziPUWBhQWzC8QS4XglFAIgeGKDWMh/vmNUozE9oAFUoP05lE2C5cMHbPzQ2RhSsuM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":1375933,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJi0KfSACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrMlg/8DDFE0P1admo9Jt8TJY9nk+M8ptUbEC9URRK2CNmZom4l2HSk\r\ni6aUZu2gWmma39tIhNppm82fLsNEai1FC6CsUWWID2X2+orGQliuOJ9edW7Q\r\nXJt5JF69p5VFHrOUGDaW4EBJHe+hNGV+oGUbf0HE/IHIQ6EcxsWAqGyc2lV2\r\ngvmxsRwi0b/n9rwtNfZEwX67MdTEKWouF0oxK1CWXHV/9Wid78FKbbCgjyKh\r\nTHtuyZaV7Gx/S5Urqpj7a7NIhhWUT8Y+GbzUnDcO1rUiUESWHsvbNtS1gv2u\r\nyBJ7r80ttJW8KFZwns9bvPzKHfgSGiTKZwWG42l+Ta5C5KqtG4k52uNBP05P\r\nl684/9VY07BxuVA0SOg+f3OdyYOmZRx3N8oATnh8y9JjwokNh9ol24erC9xO\r\nm1jHgPmevTOfxp1PfPkS0zNVQ7yI+/fIO+r1QmREwjc7wWn9A7MPRuzUgVoB\r\nA5XqjizRebjL+VDPCyJa23YouP/woh2bBqqgvGNeev03q2m75WpDD1IfmqVQ\r\n04GeML+hWUc3IhS9qrMGD/MUTRFlEiR0UAOjGyPCAxbzeJKAO26uVf4DraVl\r\n+UVGw/nnlHMLv5QVSFVjGmJ4IIR6VsPy09JzBSeMVWqjh1/Wgu/Sa649XjpF\r\nmVXGPxqriEqhGZ2/OV04QGjrTruUofmYugg=\r\n=pUsD\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"2cfaeff6f3610c9fb2495f20fb3031df8f797bd3","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.20.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.20.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.10.0","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.10.0_1657841618728_0.819039877714048","host":"s3://npm-registry-packages"}},"3.10.1":{"name":"@apollosproject/ui-onboarding","version":"3.10.1","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.10.1","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"33ce8d87e226b62bc656ba9f206cac86f2243ece","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.10.1.tgz","fileCount":96,"integrity":"sha512-yTOzikWCZI/9VazJEVyY6n/ZhuHdNhAUc02K7TEwxOOvLs7jfC8Jrw8KWnWzz2P//SMAX7nXlw1pVgpTa9vVyA==","signatures":[{"sig":"MEUCIDcA0OU+h2yl3g7hXDNSa5yO6KCnfJULSys9jcD1btcEAiEAuYkCKgtNt0cHSEk9P6XFfyq98IFJljE0SWJNWMcB5qY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":1376109,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJi3/ueACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrQoBAAnIB1VhNdH0ZTXZf5PUXd8ti7wkLNbJuU20EpLvaA6SfSGAeY\r\nGJhuVmYD1BlV1wbNo+zH+KvxyEw9TTUFAbrSzJHgaht54surNsWMCZWn7hdm\r\nfFNUPmU0+Vf9lmbXiLEFhZz3ZLV6QtpJhFnFGcH2Vthwt46E1s2zCjtVSuCQ\r\ns504An7vYtgLhoTFaVYknouQI4A9OhfrlNiXVwex1riyX7EMo+EUkINLRr/V\r\nX4r4g119wfuV7XWv/iTvcGwunAyEl9DpZoiXqU0j6CFA4jrZ7SSFV1055YTo\r\npIRd3k0aEiwYbUA2UPE4hFHtb+qxbSRIIDlvWCtPT7tkbug81rUWWi7tWGaN\r\nbGclQYSXgC7AXGlPBd7yF43slTpCPMIUzv/Wfq2AorOgJSadyJiWTKIKT86r\r\nej6Z8TVteKZLH10PYMRqcVaBHs/b8gLtC28rn1Pu3zVLBLblsYxePpdcUGBc\r\n0FsiB5MDV3q2ccHaDbSfPchZl7BSvKouosHma998oONrV+gl1oZUg7poPSYw\r\nK33LwtTAg7vCXfTr9CSbxZVMSzrDGoRgnmi+mHfbSftw01cnsJ0XIw2ZYfzt\r\n+rfobKoZ9FpK+Dbz7M2t3XCFEYok73Q7xgbrPs1wYOh5ss2CNrj/Um8K4lut\r\n9PS8IO/FmxG5+vfpKRrp+Rf3KRDhi8g9Kj8=\r\n=p8jp\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"8ede76467e49af87ef384f733a125e4bbf7698ab","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.20.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.20.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.10.1","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.10.1_1658846110179_0.5675792414682235","host":"s3://npm-registry-packages"}},"2.47.7":{"name":"@apollosproject/ui-onboarding","version":"2.47.7","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.47.7","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"774b0cd4e7d4e905e809562426c9c3b800dfa912","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.47.7.tgz","fileCount":87,"integrity":"sha512-LqpaFhKO6uICeErwNOJ4HP2WWhK6RTbmYAWpHsDGT5+nqLIOiU4s374AU22y5BgphHQ8MJX9D13AylANs0XwHg==","signatures":[{"sig":"MEQCIAfeG6uJgynTeYc3b/haJkEDf8y2W4261mdbZMlx+x6qAiAGzEQ2T3dlbfWsrPgHSGdgnlRaDjhGHIm+HzgJ1/3T9g==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":964414,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJi3/u/ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpVkg//V4NLfy0UULDejMnfYZT0HsGjJKOItwuvrYewKH5LqVdYmjAN\r\nuLu3eH6Rwm5vT4b7juE3vOUvDa6QYmXojgQsRTCiUiUDomGeEIb5tUETVbur\r\nPb2fgznvSXA0//WSfptDEssiLsNrsBEGxUKQdIWqWWi3KtaSWCfMCS8N89Vq\r\nqSWMpOUIa+1syKAdmEkBGR4OcjmeqSfMGHD6wxYx/QfrT2KrkmE27kqcgKjo\r\njb6gmT63L/v6E71E4TI4+E1BKhw/xOonZMeDFqGABV7q2HEegYSDL/yOAV81\r\n2pY4AuMgDcUX2BBLNgVE4AkVxJU5bb4ovrwFPkS+9GJ1NcpDyE71qL5v00+G\r\nexSdpzk485POOzpvJubY3markjaW7FcH6YftdiSTRWTfWyY5CLUxCDH5L+3x\r\nUCSsZRdu1KN48JfwELdTPORU/Gu7sODyFalnK5ogXBjr0i0Qkqf88sDcswlo\r\n1u0wkI+cPbnOVm6m/eBXMneNb6kFOykUv19rDxQQ6jaoA+XWtl3GDkznL6tB\r\nNHY4BB8oEam1oMWwvTtVilBriQvMGarxWp1/ndCoWFkk5cDL04U1JzKeWZfQ\r\n7T5UkDb3PiuTjiDD8W7sQytha3XOzapulwL4YXYwRGgOBULTIBa9FC6g7eCW\r\n8c1dhAQejiAAjpuTO8Til8X0FEpLOr5tfOQ=\r\n=R5Rr\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"8d384fc93c44177d51a39a1d7150534180c0ef5d","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.20.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.20.0","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.47.7_1658846142848_0.021827201209695835","host":"s3://npm-registry-packages"}},"3.10.2":{"name":"@apollosproject/ui-onboarding","version":"3.10.2","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.10.2","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"f22869583e70064a1536a7e0b1b89b1f9fe55e8d","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.10.2.tgz","fileCount":96,"integrity":"sha512-Ki2FloDnBdA5CRX9vnWHnnq/K697DSATfBOPwoHlWkmevmI4a/8S6wCvDD8v6Ont2Q1aidVfeU/wxNaY2QG/9w==","signatures":[{"sig":"MEQCIGBi8Kl9nq7rozsOjXNpA9RkINSaERy1AbXoNM0F3C04AiBuIwE0V/3rgnyfVXYnSnXlfqUKZ1nE9OT++2Gblkuc6g==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":1376285,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJi4VMUACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr7Zg//dIsELZL/ckISnDlCGJq7R8q1oqnDc0DoK+56IsaqDCtBJeE6\r\n3FY8PCtw9UkNWvL9Cz5RbL2cwITrrtguClraOoFHHL++pkk2nhuWUl2N4IyS\r\n5fU4DFTsQ6hEzfAGeHhRvOVv53EQ2atAeargKVT7hvLRz+OUgMDsToYc11pn\r\nGNkQlFpURGPpHxWeNW/G7rnuWYJcjVPaORTA7HSXE04tRxSpdNO1bi01nFrr\r\nzBvjB4jdTbEBxzpUko25mdO1JNu2ep8TsP1c2WTUtLTc6u1meoN2YxHRFF6S\r\nmfvh216iJudclJ/eT0+Mb1Lo5snF2X3YA/OS1purc+ZZi4ejV+PcZ9Ov2Xov\r\nVS+6jgtVE+U3VgiQ8xNbbe5J3KaUCDNpZQKO9kFdF5FE256BiWKKrrIdsprU\r\nxxEBC916GGP3KdFB68J3CXsy+PdpxLquYwH/iXYCNMQDJW6v+nKCbrNz6zq6\r\nq4MYMUhEdWiEXaBeVstxMWV1g0El2yJ5ygV6nPVzXAuT5hbmB1P+2yuAlbyz\r\nBnCg3MXQpmvYsXZvO1TmZIOgNDNxiQoW045hc/CkhTHJDclwuYrst+7zEOjZ\r\nJRooIkxHZ1/l/Kbsceh9aeN93GogCOEabpnVf/oUEj7okVynQzONt7mz1xr9\r\nXszjsW0A8F1aDS+PcDkGQbJTW1l/5YU2I1g=\r\n=1u9Q\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"dcd0d1a25ae4e728edbeb6f7921e9861a3440a77","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.20.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.20.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.10.2","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.10.2_1658934036163_0.8584234787245151","host":"s3://npm-registry-packages"}},"3.10.3":{"name":"@apollosproject/ui-onboarding","version":"3.10.3","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@3.10.3","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"a923750d4c7b092c905332063b46dd6118ff513f","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-3.10.3.tgz","fileCount":96,"integrity":"sha512-245Odq53HXFrhsvm1KnxG4JPeF/f54zyG4nb0+ia2M+HGDLMErlFsGNrrKLlSl6VLTLWSOcSqmrRLrx6Xs2fsA==","signatures":[{"sig":"MEQCIBDoINZBweUGhxnODTAC2g8+/EM5lF7c0LCSZ5QTzDWBAiAvazeV4SWildaEbnH/WrJHroyML7G8FtjPZWfLdvvsig==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":1420143,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJi6++zACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpf1Q/+NdLcUgZ27mNA5L/7gYy5l+I7E6kqPtT1BxV67rSO4efvTxfy\r\n8nTT3r66+DjFYwTY7YQ6n64li1kvXg/wvVJXlrJ82Q7WrsXiK8a/v4fmCK5O\r\nuAdshyJ6O0EMPDaPaROyxwkQLaa9lupLBtJfFqQ1UYjBruqWm1gKFmGpQJ50\r\nm488prApMneoxjY0aCiAy7pC03yWpvw7qMzaQh5JJWX72GzCqfxT8NKBeeCa\r\nHUV2Fgq+XrHwzN5K+NW9UZmPzg9yTZcJyN7zFtd/ZFbw0ZPnkhpYs7tkjA02\r\nuIBBZZYHf8Y/yVXB0ZiXrV+yal4ShDWkgA5QDwRE9Rg1XhVFVd7hLSGyghZE\r\n/1EiDILO2w0bWy5zWdxSr+wDzzlW2OZQR7bG6qvRx7kePnLk70Y/OXr1L+2m\r\nTtuHq0BQJHe1KOkaObX5rjtIzjYNkeasoQR2CUjFAWGDnCF7mzJOSwP1gjvw\r\nAcC2cF0ZnnJyb8E1nFRrV1dePsUn09FoSRu2YEZXnz8S+UID/i7BXpCC2bv5\r\npgtTO4/f8+L7QAFAE1g3sQPxQtHBGRtDJNWNSWLFjeYRiHtPxvwbrc3Ir5WA\r\nezFPB14xoRCSoSJ8EJmw7+WecV+JuELtTgjQzaBdla+pgCt9fRQJ5Oysrd65\r\nTsfHOHrIntB7Q3s1BEz6fEZ7dyjffb7//Cc=\r\n=Gp5k\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|react-navigation-shared-element|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*|d3|d3-*|commander))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"0f44665ec2ff21ffb6372a233fb9df7572a5560a","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"didevshop","email":"npm@differential.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v14.20.0+x64 (linux)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"14.20.0","dependencies":{"yup":"0.26.6","formik":"2.2.9","lodash":"4.17.21","moment":"2.29.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","@apollosproject/ui-test-utils":"^3.10.3","react-native-safe-area-context":"^3.0.7","react-navigation-shared-element":"^2.0.0"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","react-native-reanimated":"^2.0.0","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","react-navigation-shared-element":"*","@apollosproject/ui-notifications":"*","@react-native-community/async-storage":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_3.10.3_1659629491480_0.747705028655997","host":"s3://npm-registry-packages"}},"2.47.9":{"name":"@apollosproject/ui-onboarding","version":"2.47.9","keywords":["react-native-component","react-component","react-native"],"license":"SEE LICENSE IN LICENSE.md","_id":"@apollosproject/ui-onboarding@2.47.9","maintainers":[{"name":"yungvincenzo","email":"vince@classyh.at"},{"name":"conrad_vanl","email":"hi@convan.me"},{"name":"redreceipt","email":"micneeley14@gmail.com"},{"name":"didevshop","email":"npm@differential.com"}],"homepage":"https://github.com/apollosproject/apollos-apps#readme","bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"dist":{"shasum":"6b900324fe7f71f4cb49ea8068f75950393632bf","tarball":"https://registry.npmjs.org/@apollosproject/ui-onboarding/-/ui-onboarding-2.47.9.tgz","fileCount":87,"integrity":"sha512-YinkrbYVBSR+Jcur0aTnzdiLdHXTRp4REuxOzILnUgZrJdAy0FtyMc7U5VhzYqUM+Aqi0Rt2r2oUL4X+wmKgvw==","signatures":[{"sig":"MEUCIQCiHUDZlaOKZkw7nOG0uPkVGyIKjkWe57VSO/lmCf9ZkQIgAy21WLOqTopZV/KbuMX2GQgkS4zexguQqfESeauDEtw=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":964766,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjLGlVACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrHGw//Yjk7tFfthpIx+3G7FssU5K0s+4y49OhMD616rPyeKTzsSKxE\r\nNIjLDoNXAYMSDe90bACTC5dwR5M+vJRyPDpHFROlvnxivctM4romCw4qmW24\r\nSRnfQQrWxKoHFpgwKVh2Z4FJ1Vkyh+G79ks88QOldwHo4lt7c1q2eVouND7j\r\nFpkM7qiR4J6MkovlabzAg6z8CEce6wRqW83PcIBZAMGsZfaT9RgNB4yPz/BZ\r\n3hcHh1TXjIIMOKsx8RuONDU1JnQoWwMpyX1f2JKSP+sdckGegejLB4kTyMLW\r\n2Tpl2tJovfFWlmMiBlm5ekIeuBYmlUBQO5BnD7xRI4IHKz7gcOrpntFkwFQ6\r\nQa+PqkhM6G7niHNL5OQpCKMgyqZn5Un1zYPei5vQUN7ccLK7LZO9IAvDntog\r\nZxq5x9xOFgsL+En/q6IbCl2MKE3xv3T5IbjB0zdhU/hbOysX7wkD7HgIRYrr\r\n6abD6cerOc/mZuFZw55CKLLet0C/KNexelgybqo5vC2RBYCMgV/LzvvuyPWH\r\n8gP8KJl5rliZfkTzBfz7GgW55BjrM87cCWBaND/9u7ZQLpHTQP8TuHfUFxBu\r\np7zAxFK8YnPIv/gBJ9IEzdIXuwHKeZ3Nn87Bv0t3C3IxWYAS32OhyKWIv4h7\r\nXIStw4drjpjp3DI03z7ZO9weQck4nIU0QY4=\r\n=9erT\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"preset":"react-native","testMatch":["/src/**/?(*.)(test|tests).{js,jsx,mjs}"],"setupFiles":["../apollos-ui-test-utils/src/mocks/reanimated.js","./jest.setup.js"],"modulePaths":["/src/"],"collectCoverage":true,"coverageReporters":["json","lcovonly","clover"],"transformIgnorePatterns":["node_modules/(?!((jest-)?react-native|rn-*|@react-native-picker|react-clone-referenced-element|@react-navigation/native|@react-navigation/stack|@apollosproject|@apollosproject/ui-*))"],"modulePathIgnorePatterns":["node_modules/@storybook/"]},"main":"src/index.js","readme":"# Apollos UI: OnBoarding\n\nReact Native components to create an Onboarding experience.\n\n## Installation\n\nThis package should be in your Apollo's Client if you got started with the example repo. For an example implmentation, check the `apolloschurchapp`.\n\n## Usage\n\nThis package lets you configure onboarding in three different ways.\n\n### 1. Use the built in connected components.\n\nThe \"connected components\" are built to work for the majority of use cases. They rely on an unmodified schema, but will probabbly work if you made additions or subtle changes.\n\nTo use these components, import them from the `@apollosproject/ui-onboarding` package and compose them into the main slider.\n\n```\nimport {\n AskNotificationsConnected,\n AskNameConnected,\n FeaturesConnected,\n AboutYouConnected,\n LocationFinderConnected,\n OnboardingSwiper,\n} from '@apollosproject/ui-onboarding';\n...\nfunction Onboarding({ navigation }) {\n return (\n \n {({ swipeForward }) => (\n <>\n \n \n }\n />\n \n }\n />\n {\n navigation.navigate('Location', {\n onFinished: swipeForward,\n });\n }}\n BackgroundComponent={\n \n }\n />\n \n {(client) => (\n navigation.navigate('Home')}\n onRequestPushPermissions={() =>\n requestPushPermissions({ client })\n }\n primaryNavText={'Finish'}\n BackgroundComponent={\n \n }\n />\n )}\n \n \n )}\n \n );\n}\n```\n\nAs you can see, each of the connected components may require specific props that may change depending on how your app is implemented. The notifications connected component right now is a little hairy, but that will be fixed in the future with a `ui-notifications` package.\n\n### 2. Use the built in visual components, but \"connect them\" yourself.\n\nThis is the best strategy if you wish to change the schema or mutations for your components, but don't want to change the way the components look or function.\n\nThe aproach is roughly the same as above, but you will have to define your `connected` components locally. You can import the underlying visual components from the `ui-onboarding` package by importing without `Connected`. IE: `import { ConnectedAskName } ...` becomes `import { AskName } ...`.\n\n### 3. Use our component building blocks to build your own new Onboarding slides.\n\nThis is the most advanced implementation, but gives the most control. You can import the `` component (whose props are documented in PropTypes) to construct your very own slide. You can look at the slides defined in this package for reference on how to construct a custom slide.\n\n\n## Exported Components.\n\n### OnboardingSwiper\n\nNo props are needed. The first and only child should be a callback function which is called passing the arg `({ swipeForward })`. Calling swipe forward imperatively will move the onboarding slider forward by one slide. The callback function should return\n\nA. A `React.Fragment` with each slide `node` as a child.\nB. An array of slide `nodes`.\n\nLooking for more flexibility? Want to jump to a specific slide or swipe back. Checkout the `scrollBy` arg.\n\n### [AskName](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskName.js), [AskNameConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskName/AskNameConnected.js)\n\n### [AskNotifications](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotifications.js), [AskNotificationsConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AskNotifications/AskNotificationsConnected.js)\n\n### [AboutYou](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYou.js), [AboutYouConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/AboutYou/AboutYouConnected.js)\n\n### [LocationFinder](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinder.js), [LocationFinderConnected](https://github.com/ApollosProject/apollos-prototype/blob/master/packages/apollos-ui-onboarding/src/slides/LocationFinder/LocationFinderConnected.js)\n\n## Analytics\n\nUsing this package automatically provides analytics over the onboarding experience, assuming you areusing the `@apollosproject/ui-analytics` package.\n\nAs of right now, each screen emits a \"ScreenName Completed\" or \"ScreenName Skipped\" event when the screen has been completed or skipped. We consider this an \"80 for the 20\" aproach, because it is enough information to construct a funnel chart display points at which a user drops off from the Onboarding flow.\n\nIf further analytics events are required, submit an RFC (or a pull-request!) with what you are looking for, and our team will take a look.\n\nYou can implement your own anlytics by passing a `pressPrimaryEventName` or `pressSecondaryEventName` prop to the `Screen` component. If those strings are passed, a `track` will be called when the primary or secondary button is pressed.","engines":{"node":">=14"},"gitHead":"a47ced4d09c147f24c98807d2ea58fba577663fc","scripts":{"lint":"eslint ./src --ext .js","test":"TZ=UTC jest --no-watchman","generate-stories":"rnstl --searchDir ./src --pattern **/*.stories.js"},"_npmUser":{"name":"redreceipt","email":"micneeley14@gmail.com"},"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"_npmVersion":"lerna/4.0.0/node@v16.13.1+x64 (darwin)","description":"React Native components to create an Onboarding experience.","directories":{},"_nodeVersion":"16.13.1","dependencies":{"yup":"0.26.6","formik":"1.5.1","lodash":"4.17.21","moment":"2.22.2","react-is":"^16.9.0","react-native-swiper":"^1.5.14","@react-native-community/async-storage":"^1.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"jest":"^25.1.0","react":"16.13.1","waait":"1.0.2","prop-types":"15.7.2","react-native":"0.63.2","@apollo/client":"3.3.20","react-test-renderer":"16.13.1","@storybook/react-native":"5.2.4","react-native-safe-area-context":"^3.0.7"},"peerDependencies":{"react":"*","react-native":"*","@apollo/client":"*","@apollosproject/ui-kit":"*","@apollosproject/storybook":"*","@apollosproject/ui-map-view":"*","@apollosproject/ui-analytics":"*","@apollosproject/ui-connected":"*","@apollosproject/ui-fragments":"*","react-native-safe-area-context":"*","@apollosproject/ui-notifications":"*"},"_npmOperationalInternal":{"tmp":"tmp/ui-onboarding_2.47.9_1663854933377_0.7850144939559875","host":"s3://npm-registry-packages"}}},"time":{"created":"2019-05-08T17:03:53.439Z","modified":"2026-01-30T18:39:22.778Z","0.8.5":"2019-05-08T17:03:53.892Z","0.8.6":"2019-05-14T15:38:08.923Z","0.8.6-alpha.9":"2019-05-14T19:52:35.559Z","0.8.7-alpha.1":"2019-05-15T13:41:12.408Z","0.8.7-alpha.8":"2019-05-15T16:09:52.931Z","0.8.7-alpha.2":"2019-05-15T18:28:12.132Z","0.8.7-alpha.9":"2019-05-20T19:01:12.054Z","0.8.7-alpha.15":"2019-05-23T19:46:04.234Z","0.8.7-alpha.19":"2019-05-28T20:24:27.906Z","0.8.7-alpha.23":"2019-05-30T14:30:38.927Z","0.8.7-alpha.26":"2019-05-31T16:55:10.307Z","0.8.7":"2019-06-04T17:22:29.655Z","0.8.7-alpha.32":"2019-06-04T18:19:38.411Z","1.0.0-beta.0":"2019-06-07T18:12:30.036Z","0.8.7-alpha.35":"2019-06-07T20:05:24.903Z","1.0.0-alpha.0":"2019-06-13T12:53:14.831Z","1.0.0-alpha.3":"2019-06-17T14:30:21.239Z","1.0.0-alpha.16":"2019-06-26T16:21:14.615Z","1.0.0":"2019-06-28T01:39:24.055Z","1.0.1-alpha.4":"2019-07-02T19:28:17.771Z","1.0.1-alpha.16":"2019-07-13T19:12:34.779Z","1.0.1-1.1.0-beta.0.0":"2019-07-16T18:08:40.073Z","1.1.0-beta.0":"2019-07-16T18:11:57.574Z","1.1.0-alpha.0":"2019-07-17T12:34:14.992Z","1.1.0-alpha.7":"2019-07-19T13:32:58.125Z","1.1.0-alpha.14":"2019-07-24T18:14:32.251Z","1.1.0-alpha.19":"2019-07-25T17:34:08.691Z","1.1.0-beta.1":"2019-07-29T12:42:00.312Z","1.1.0-alpha.24":"2019-07-29T14:18:52.216Z","1.1.0-beta.2":"2019-07-29T18:32:36.799Z","1.1.0-alpha.28":"2019-07-29T18:34:10.627Z","1.1.0-alpha.29":"2019-07-29T19:41:46.563Z","1.1.0-beta.3":"2019-08-05T13:22:59.561Z","1.1.0-alpha.13":"2019-08-13T12:42:22.648Z","1.1.0":"2019-08-14T13:12:20.170Z","1.1.1-alpha.3":"2019-08-28T15:11:39.907Z","1.1.1-alpha.12":"2019-09-04T00:48:39.943Z","1.1.1-alpha.27":"2019-09-17T16:11:59.572Z","1.2.0-beta.0":"2019-09-25T14:10:29.135Z","1.2.0-beta.1":"2019-10-02T13:38:53.258Z","1.2.0-alpha.1":"2019-10-02T18:08:32.738Z","1.2.0-alpha.5":"2019-10-07T14:21:02.419Z","1.2.0-alpha.6":"2019-10-07T14:49:29.439Z","1.2.0-beta.2":"2019-10-07T15:13:22.220Z","1.2.0-alpha.3":"2019-10-08T15:52:24.487Z","1.2.0-beta.3":"2019-10-10T14:08:17.333Z","1.2.0-beta.4":"2019-10-14T12:31:24.784Z","1.2.0-beta.5":"2019-10-18T16:21:24.402Z","1.2.0-beta.6":"2019-10-21T17:15:54.414Z","1.2.0-beta.7":"2019-10-23T19:49:50.540Z","1.2.0":"2019-10-31T17:57:43.186Z","1.2.1":"2019-11-05T15:39:03.825Z","1.2.2":"2019-11-06T20:46:13.254Z","1.2.2-alpha.3":"2019-11-07T15:06:37.177Z","1.2.3-alpha.6":"2019-11-10T20:51:00.843Z","1.2.3-alpha.7":"2019-11-12T15:54:52.846Z","1.2.3":"2019-11-12T17:42:07.516Z","1.2.3-alpha.10":"2019-11-12T19:02:27.276Z","1.2.4":"2019-11-20T22:59:23.509Z","1.2.4-alpha.18":"2019-11-21T00:36:48.074Z","1.2.5-alpha.4":"2019-12-03T15:48:09.059Z","1.2.5-alpha.10":"2019-12-06T20:40:13.294Z","1.2.5-alpha.11":"2019-12-06T22:21:41.692Z","1.2.5":"2019-12-10T19:19:04.161Z","1.2.5-alpha.12":"2019-12-13T14:51:23.333Z","1.2.6-alpha.5":"2019-12-16T22:59:38.024Z","1.2.6-alpha.6":"2019-12-18T15:15:10.348Z","1.2.6-alpha.11":"2020-01-10T20:40:16.260Z","1.2.6-alpha.17":"2020-01-15T15:30:00.132Z","1.2.6-alpha.19":"2020-01-15T19:19:07.513Z","1.3.0-beta.0":"2020-01-16T15:30:44.204Z","1.2.6-alpha.22":"2020-01-16T16:40:57.412Z","1.3.0-beta.1":"2020-01-16T21:01:11.102Z","1.3.0-alpha.0":"2020-01-17T16:27:31.885Z","1.3.0-alpha.15":"2020-01-28T18:00:59.973Z","1.3.0-beta.2":"2020-01-28T18:52:13.858Z","1.3.0-beta.3":"2020-01-28T20:23:06.374Z","1.3.0-beta.4":"2020-01-29T13:27:44.458Z","1.3.0-alpha.17":"2020-02-06T18:20:31.105Z","1.3.0-beta.5":"2020-02-06T20:11:15.513Z","1.3.0-alpha.19":"2020-02-06T21:21:16.980Z","1.3.0-beta.6":"2020-02-19T16:14:37.061Z","1.3.0":"2020-03-05T18:08:18.491Z","1.3.0-alpha.23":"2020-03-13T18:49:34.066Z","1.3.0-alpha.40":"2020-04-02T04:32:13.642Z","1.3.0-alpha.42":"2020-04-06T17:28:09.945Z","1.3.1-beta.0":"2020-04-06T17:40:38.299Z","1.3.0-alpha.46":"2020-04-08T15:21:11.348Z","1.3.1":"2020-04-13T15:00:33.330Z","1.3.2-1.4.0-beta.0.0":"2020-04-15T12:54:32.646Z","1.4.0-beta.0":"2020-04-15T12:58:42.621Z","1.4.0-beta.1":"2020-04-17T20:41:15.696Z","1.4.0-beta.2":"2020-04-27T17:37:13.726Z","1.3.2":"2020-04-28T16:59:04.228Z","1.4.0":"2020-05-04T15:34:10.444Z","1.4.1-alpha.11":"2020-05-20T19:34:55.852Z","1.4.1":"2020-06-02T18:54:00.100Z","1.4.1-alpha.16":"2020-06-02T20:23:08.592Z","1.4.2":"2020-06-05T15:25:23.359Z","1.4.1-alpha.18":"2020-06-08T17:23:40.638Z","1.4.1-alpha.24":"2020-06-11T03:48:33.840Z","1.4.3":"2020-06-22T20:59:54.934Z","1.4.4-alpha.12":"2020-07-23T13:54:25.788Z","1.4.4-alpha.13":"2020-07-23T16:36:51.408Z","1.4.4-alpha.14":"2020-07-23T16:55:15.055Z","1.4.4-alpha.26":"2020-07-31T19:31:24.965Z","1.5.0-beta.0":"2020-08-03T14:51:27.133Z","1.5.0":"2020-08-18T18:00:04.039Z","1.4.4-alpha.35":"2020-08-18T19:22:33.509Z","1.5.1-alpha.31":"2020-09-17T14:47:23.520Z","1.6.0-beta.0":"2020-09-21T22:16:26.617Z","1.6.0-alpha.5":"2020-10-08T17:16:56.666Z","1.6.0":"2020-10-09T18:15:18.434Z","1.7.0-beta.0":"2020-10-19T20:43:57.526Z","1.6.1-alpha.18":"2020-10-19T20:48:35.561Z","1.7.0-beta.1":"2020-10-23T14:11:12.038Z","1.7.0-beta.2":"2020-10-27T13:37:36.692Z","2.0.0-alpha.2":"2020-10-28T14:23:57.364Z","2.0.0-alpha.3":"2020-11-06T13:42:00.019Z","1.7.0-beta.3":"2020-11-09T13:50:19.739Z","1.7.0":"2020-11-18T19:47:35.916Z","2.0.0-alpha.4":"2020-11-23T17:20:51.219Z","2.0.0-alpha.5":"2020-11-23T19:32:44.375Z","2.0.0-alpha.6":"2020-11-25T16:08:32.679Z","2.0.0-alpha.7":"2020-11-25T19:39:13.038Z","2.0.0-alpha.8":"2020-11-25T19:40:11.500Z","2.0.0-alpha.9":"2020-11-30T19:05:15.293Z","2.0.0-alpha.10":"2020-11-30T20:22:53.077Z","2.0.0-alpha.11":"2020-12-08T15:27:33.309Z","2.0.0-alpha.12":"2020-12-09T13:45:35.630Z","2.0.0-alpha.13":"2020-12-11T14:41:17.794Z","2.0.0-alpha.14":"2020-12-11T20:54:27.393Z","2.0.0-alpha.15":"2020-12-14T16:54:12.061Z","1.7.1-alpha.9":"2020-12-17T15:08:17.450Z","1.8.0-beta.0":"2021-01-06T17:13:25.764Z","2.0.0-alpha.17":"2021-01-07T14:34:43.820Z","2.0.0-beta.0":"2021-01-07T16:42:42.127Z","2.0.0-alpha.0":"2021-01-07T16:45:49.875Z","2.0.0-alpha.1":"2021-01-20T17:06:43.196Z","2.0.0-beta.1":"2021-01-22T21:26:19.510Z","2.0.0-beta.2":"2021-01-27T18:57:45.710Z","2.0.0-2.0.0-alpha.16.0":"2021-01-27T20:36:46.232Z","1.8.0-alpha.8":"2021-02-03T14:41:55.016Z","2.0.0-beta.3":"2021-02-03T14:47:24.460Z","2.0.0-beta.4":"2021-02-03T16:12:09.323Z","1.8.0-alpha.11":"2021-02-03T16:29:39.290Z","2.0.0":"2021-02-03T20:25:05.831Z","2.0.1-canary.16":"2021-02-11T22:05:26.706Z","2.0.1-canary.0":"2021-02-12T17:40:47.341Z","2.1.0":"2021-02-26T17:22:24.112Z","2.1.1":"2021-02-26T17:26:33.210Z","2.1.2-canary.5":"2021-03-02T21:02:09.345Z","2.2.0":"2021-03-04T18:28:15.777Z","2.2.1-canary.8":"2021-03-10T20:32:15.434Z","2.2.1-canary.12":"2021-03-11T18:14:21.864Z","2.3.0":"2021-03-11T19:12:34.022Z","2.3.1-canary.0":"2021-03-11T19:55:02.095Z","2.3.1":"2021-03-11T20:26:32.745Z","2.3.2-canary.0":"2021-03-11T21:13:12.274Z","2.3.2-canary.1":"2021-03-12T20:26:25.293Z","2.3.2-canary.10":"2021-03-17T19:33:07.337Z","2.4.0":"2021-03-18T00:23:07.554Z","2.4.1-canary.7":"2021-03-22T17:59:10.863Z","2.5.0":"2021-03-22T18:59:25.703Z","2.5.1-canary.7":"2021-03-24T19:20:34.300Z","2.6.0":"2021-03-24T19:59:56.260Z","2.7.0":"2021-03-25T17:37:05.358Z","2.7.1-canary.0":"2021-03-25T17:38:50.051Z","2.8.0":"2021-03-29T12:27:30.710Z","2.8.1-canary.0":"2021-03-29T12:29:12.599Z","2.9.0":"2021-03-30T12:15:29.850Z","2.9.1-canary.0":"2021-03-30T12:17:15.439Z","2.9.1-canary.1":"2021-03-30T15:48:26.130Z","2.10.0":"2021-04-06T14:44:17.873Z","2.11.0":"2021-04-12T17:34:26.008Z","2.11.1-canary.9":"2021-04-14T16:57:47.211Z","2.12.0":"2021-04-22T18:56:12.024Z","2.13.0":"2021-04-23T13:43:39.627Z","2.13.1":"2021-04-28T13:56:21.021Z","2.14.0":"2021-05-14T15:38:06.572Z","2.14.1-canary.3":"2021-05-18T17:28:13.716Z","2.15.0":"2021-05-19T14:05:58.102Z","2.16.0":"2021-05-20T14:12:41.706Z","2.17.0":"2021-05-24T18:41:55.481Z","2.18.0":"2021-05-27T18:23:15.880Z","2.18.1":"2021-06-01T17:57:05.094Z","2.19.0":"2021-06-07T13:51:37.513Z","2.19.1-canary.8":"2021-06-11T15:56:04.709Z","2.20.0":"2021-06-14T12:44:38.326Z","2.20.1-canary.1":"2021-06-15T14:04:39.978Z","1.8.0":"2021-06-16T13:02:44.396Z","2.21.0":"2021-06-16T20:51:42.605Z","2.21.1":"2021-06-17T15:46:50.946Z","2.21.2":"2021-06-18T17:53:21.525Z","2.22.0":"2021-06-23T18:28:52.053Z","2.22.1-canary.3":"2021-06-24T13:47:42.547Z","2.23.0":"2021-06-24T18:03:57.027Z","2.23.1":"2021-06-24T18:53:51.625Z","2.23.2-canary.2":"2021-06-25T17:39:49.002Z","2.24.0":"2021-06-28T14:21:19.210Z","2.24.1-canary.3":"2021-06-29T14:43:54.486Z","2.24.1-canary.4":"2021-06-29T16:42:01.755Z","2.24.1-canary.6":"2021-06-30T13:39:03.594Z","2.25.0":"2021-06-30T16:25:42.087Z","2.25.1-canary.2":"2021-06-30T22:46:24.278Z","2.26.0":"2021-07-09T18:13:41.047Z","2.27.0":"2021-07-19T17:11:43.544Z","2.27.1":"2021-07-20T13:22:50.211Z","2.27.2":"2021-07-20T19:41:27.028Z","2.27.3-canary.7":"2021-07-27T21:18:43.513Z","2.28.0":"2021-08-04T14:52:09.813Z","2.28.1-canary.0":"2021-08-04T14:53:50.635Z","2.29.0":"2021-08-05T18:32:05.943Z","2.29.1-canary.0":"2021-08-05T18:33:48.960Z","2.29.1":"2021-08-06T14:17:09.992Z","2.29.2-canary.0":"2021-08-06T14:19:01.116Z","2.29.2":"2021-08-06T15:38:12.578Z","2.29.3-canary.0":"2021-08-06T15:39:53.197Z","2.29.3":"2021-08-11T14:51:49.847Z","2.29.4-canary.0":"2021-08-11T14:53:44.568Z","2.29.4-canary.5":"2021-08-13T00:13:08.971Z","2.30.0":"2021-08-17T14:09:49.720Z","2.31.0":"2021-08-26T20:08:34.570Z","2.32.0":"2021-09-03T19:27:56.173Z","2.32.1":"2021-09-07T15:49:15.443Z","2.32.2":"2021-09-09T17:42:22.442Z","2.33.0":"2021-09-15T15:32:01.581Z","2.33.1":"2021-09-15T21:25:21.115Z","2.33.2":"2021-09-17T17:42:44.589Z","2.33.3":"2021-09-22T14:31:44.825Z","2.33.4":"2021-09-27T13:37:57.672Z","2.34.0":"2021-10-01T18:36:28.744Z","2.34.1-canary.4":"2021-10-08T19:50:31.809Z","2.35.0":"2021-10-12T13:40:41.875Z","2.35.1-canary.1":"2021-10-13T22:45:26.041Z","2.35.1-canary.3":"2021-10-15T21:57:42.929Z","2.36.0":"2021-10-21T20:31:52.578Z","2.36.1":"2021-10-22T21:02:50.663Z","2.36.2-canary.1":"2021-10-25T23:19:43.959Z","2.36.2":"2021-10-28T00:49:07.658Z","2.36.3":"2021-10-29T13:36:28.109Z","2.36.4-canary.3":"2021-11-12T17:11:17.347Z","2.37.0":"2021-11-12T17:20:33.458Z","2.37.1-canary.3":"2021-11-15T15:02:54.476Z","2.38.0":"2021-11-15T16:52:35.746Z","2.39.0":"2021-11-22T19:41:26.947Z","2.40.0":"2021-12-07T01:55:40.215Z","2.40.1-canary.2":"2021-12-08T17:33:05.347Z","2.41.0":"2021-12-10T17:03:23.155Z","2.41.1-canary.17":"2022-01-10T23:27:09.258Z","2.42.0":"2022-01-11T16:33:30.726Z","3.0.0-canary.23":"2022-01-26T20:18:36.123Z","2.43.0":"2022-01-27T23:07:09.181Z","2.43.1":"2022-02-01T22:44:04.835Z","3.0.0-canary.36":"2022-02-02T15:16:42.582Z","3.0.0-canary.41":"2022-02-03T16:44:27.025Z","2.43.2-canary.6":"2022-02-03T18:19:07.465Z","3.0.0-canary.43":"2022-02-03T21:02:34.671Z","3.0.0-canary.60":"2022-02-25T19:17:24.016Z","3.0.0":"2022-02-28T19:13:20.533Z","2.43.2-canary.24":"2022-02-28T20:11:59.546Z","3.0.1":"2022-02-28T20:55:10.791Z","3.0.2":"2022-03-01T21:54:15.894Z","2.44.0":"2022-03-03T17:35:34.087Z","2.44.1":"2022-03-03T22:03:49.820Z","2.44.2":"2022-03-04T16:46:20.222Z","2.44.3":"2022-03-14T14:35:57.032Z","2.44.4":"2022-03-15T23:10:50.523Z","3.1.0":"2022-03-22T16:27:25.732Z","2.45.0":"2022-03-22T19:53:00.918Z","3.1.1":"2022-03-22T21:58:48.456Z","3.1.1-canary.1":"2022-03-23T14:25:06.441Z","2.45.1":"2022-03-29T13:32:46.420Z","3.1.2":"2022-03-29T15:14:58.433Z","2.46.0":"2022-03-29T18:29:43.614Z","2.46.1":"2022-03-30T15:11:01.875Z","2.46.2":"2022-03-30T19:37:39.432Z","2.46.3":"2022-03-30T19:40:25.711Z","2.46.4":"2022-03-30T19:44:10.171Z","2.46.5":"2022-03-30T19:47:06.702Z","2.46.6":"2022-03-30T19:50:44.039Z","2.46.7":"2022-03-30T19:53:31.080Z","2.46.8":"2022-03-30T19:56:00.164Z","2.46.9":"2022-03-30T19:59:15.512Z","2.46.10":"2022-03-30T20:02:17.001Z","2.46.11":"2022-03-30T20:04:21.784Z","2.46.12":"2022-03-30T20:07:23.337Z","2.46.13":"2022-03-30T20:11:07.748Z","2.46.14":"2022-03-30T20:13:45.445Z","2.46.15":"2022-03-30T20:16:46.131Z","2.46.16":"2022-03-30T20:19:38.786Z","2.46.17":"2022-03-30T20:23:33.407Z","2.46.18":"2022-03-30T20:26:31.305Z","2.46.19":"2022-03-30T20:29:08.227Z","2.46.20":"2022-03-30T20:32:40.635Z","2.46.21":"2022-03-30T20:36:52.313Z","2.46.22":"2022-03-30T20:39:39.522Z","2.46.23":"2022-03-30T20:43:13.770Z","2.46.24":"2022-03-30T20:45:56.437Z","2.46.25":"2022-03-30T20:49:02.986Z","2.46.26":"2022-03-30T20:52:48.454Z","2.46.28":"2022-03-30T20:59:03.801Z","2.46.29":"2022-03-30T21:01:49.650Z","2.46.30":"2022-03-30T21:05:12.589Z","2.46.31":"2022-03-30T21:08:33.136Z","2.46.32":"2022-03-30T21:11:08.563Z","2.46.33":"2022-03-30T21:14:16.351Z","2.46.34":"2022-03-30T21:17:54.863Z","2.46.35":"2022-03-30T21:21:01.690Z","2.46.36":"2022-03-30T21:23:53.326Z","2.46.37":"2022-03-30T21:27:38.266Z","2.46.38":"2022-03-30T21:30:14.695Z","2.46.39":"2022-03-30T21:34:14.566Z","2.46.40":"2022-03-30T21:38:08.546Z","2.46.41":"2022-03-30T21:41:10.814Z","2.46.42":"2022-03-30T21:44:10.839Z","2.46.43":"2022-03-30T21:47:23.667Z","2.46.44":"2022-03-30T21:51:49.506Z","2.46.45":"2022-03-30T21:55:39.122Z","2.46.46":"2022-03-30T21:58:11.309Z","2.46.47":"2022-03-30T22:02:02.428Z","2.46.48":"2022-03-30T22:04:31.456Z","2.46.49":"2022-03-30T22:08:11.536Z","2.46.50":"2022-03-30T22:11:47.908Z","2.46.51":"2022-03-30T22:14:16.544Z","2.46.52":"2022-03-30T22:17:48.382Z","2.46.53":"2022-03-30T22:20:30.677Z","2.46.54":"2022-03-30T22:24:09.023Z","2.46.55":"2022-03-30T22:27:35.705Z","2.46.56":"2022-03-30T22:30:46.504Z","2.46.57":"2022-03-30T22:34:14.305Z","2.46.58":"2022-03-30T22:36:44.903Z","2.46.59":"2022-03-30T22:40:34.977Z","2.46.60":"2022-03-30T22:43:37.008Z","2.46.61":"2022-03-30T22:46:32.701Z","2.46.62":"2022-03-30T22:49:06.909Z","2.46.63":"2022-03-30T22:51:48.760Z","2.46.64":"2022-03-30T22:54:42.808Z","2.46.65":"2022-03-30T22:57:15.159Z","2.46.66":"2022-03-30T22:59:54.762Z","2.46.67":"2022-03-30T23:03:11.783Z","2.46.68":"2022-03-30T23:06:35.062Z","2.46.69":"2022-03-30T23:10:42.495Z","2.46.70":"2022-03-30T23:14:13.650Z","2.46.71":"2022-03-30T23:17:03.775Z","2.46.72":"2022-03-30T23:20:12.967Z","2.46.73":"2022-03-30T23:23:59.198Z","2.46.74":"2022-03-30T23:27:24.464Z","2.46.75":"2022-03-30T23:30:13.626Z","2.46.76":"2022-03-30T23:34:10.470Z","2.46.77":"2022-03-30T23:37:25.164Z","2.46.78":"2022-03-30T23:39:55.555Z","2.46.79":"2022-03-30T23:42:54.999Z","2.46.80":"2022-03-30T23:46:58.362Z","2.46.81":"2022-03-30T23:50:36.928Z","2.46.82":"2022-03-30T23:54:12.787Z","2.46.83":"2022-03-30T23:57:41.406Z","2.46.84":"2022-03-31T00:00:01.108Z","2.46.85":"2022-03-31T00:03:44.682Z","2.46.86":"2022-03-31T00:06:20.015Z","2.46.87":"2022-03-31T00:11:15.312Z","2.46.88":"2022-03-31T00:14:17.098Z","2.46.89":"2022-03-31T00:17:46.213Z","2.46.90":"2022-03-31T00:21:51.003Z","2.46.91":"2022-03-31T00:25:42.845Z","2.46.92":"2022-03-31T00:29:32.516Z","2.46.93":"2022-03-31T00:32:33.227Z","2.46.94":"2022-03-31T00:36:07.608Z","2.46.95":"2022-03-31T00:39:54.640Z","2.46.96":"2022-03-31T00:42:52.178Z","2.46.97":"2022-03-31T00:46:56.356Z","2.46.98":"2022-03-31T00:50:06.591Z","2.46.99":"2022-03-31T00:53:13.344Z","2.46.100":"2022-03-31T00:56:01.309Z","2.46.101":"2022-03-31T00:59:28.678Z","2.46.102":"2022-03-31T01:03:12.053Z","2.46.103":"2022-03-31T01:06:09.010Z","2.46.104":"2022-03-31T01:09:48.023Z","2.46.105":"2022-03-31T01:13:08.702Z","2.46.106":"2022-03-31T01:16:42.946Z","2.46.107":"2022-03-31T01:20:05.618Z","2.46.108":"2022-03-31T01:23:04.751Z","2.46.109":"2022-03-31T01:26:21.228Z","2.46.110":"2022-03-31T01:29:32.725Z","2.46.111":"2022-03-31T01:32:29.689Z","2.46.112":"2022-03-31T01:36:17.169Z","2.46.113":"2022-03-31T01:39:40.958Z","2.46.114":"2022-03-31T01:42:13.906Z","2.46.115":"2022-03-31T01:46:01.381Z","2.46.116":"2022-03-31T01:49:36.037Z","2.46.117":"2022-03-31T01:53:33.608Z","2.46.118":"2022-03-31T01:56:43.938Z","2.46.119":"2022-03-31T01:59:45.970Z","2.46.120":"2022-03-31T02:02:27.399Z","2.46.121":"2022-03-31T02:05:12.781Z","2.46.122":"2022-03-31T02:07:58.864Z","2.46.123":"2022-03-31T02:10:39.871Z","2.46.124":"2022-03-31T02:13:24.683Z","2.46.125":"2022-03-31T02:17:18.332Z","2.46.126":"2022-03-31T02:20:34.453Z","2.46.127":"2022-03-31T02:23:50.548Z","2.46.128":"2022-03-31T02:27:03.296Z","2.46.129":"2022-03-31T02:30:55.090Z","2.46.130":"2022-03-31T02:34:07.739Z","2.46.131":"2022-03-31T02:36:48.168Z","2.46.132":"2022-03-31T02:40:08.721Z","2.46.133":"2022-03-31T02:42:44.782Z","2.46.134":"2022-03-31T02:47:12.830Z","2.46.135":"2022-03-31T02:49:24.799Z","2.46.136":"2022-03-31T02:52:55.469Z","2.46.137":"2022-03-31T02:55:52.912Z","2.46.138":"2022-03-31T02:58:28.130Z","2.46.139":"2022-03-31T03:01:08.712Z","2.46.140":"2022-03-31T03:04:38.130Z","2.46.141":"2022-03-31T03:07:03.236Z","2.46.142":"2022-03-31T03:11:00.235Z","2.46.143":"2022-03-31T03:14:16.111Z","2.46.144":"2022-03-31T03:16:50.691Z","2.46.145":"2022-03-31T03:20:39.799Z","2.46.146":"2022-03-31T03:24:07.050Z","2.46.147":"2022-03-31T03:27:38.975Z","2.46.148":"2022-03-31T03:30:35.737Z","2.46.149":"2022-03-31T03:33:47.247Z","2.46.150":"2022-03-31T03:36:47.545Z","2.46.151":"2022-03-31T03:40:44.289Z","2.46.152":"2022-03-31T03:44:18.585Z","2.46.153":"2022-03-31T03:46:58.374Z","2.46.154":"2022-03-31T03:49:42.811Z","2.46.155":"2022-03-31T03:52:28.808Z","2.46.156":"2022-03-31T03:55:27.414Z","2.46.157":"2022-03-31T03:59:25.876Z","2.46.158":"2022-03-31T04:02:54.668Z","2.46.159":"2022-03-31T04:05:34.822Z","2.46.160":"2022-03-31T04:09:32.078Z","2.46.161":"2022-03-31T04:12:07.096Z","2.46.162":"2022-03-31T04:14:47.837Z","2.46.163":"2022-03-31T04:18:00.148Z","2.46.164":"2022-03-31T04:21:22.069Z","2.46.165":"2022-03-31T04:23:57.595Z","2.46.166":"2022-03-31T04:26:44.889Z","2.46.167":"2022-03-31T04:29:27.289Z","2.46.168":"2022-03-31T04:32:55.270Z","2.46.169":"2022-03-31T04:35:30.667Z","2.46.170":"2022-03-31T04:38:30.626Z","2.46.171":"2022-03-31T04:41:18.351Z","2.46.172":"2022-03-31T04:45:24.067Z","2.46.173":"2022-03-31T04:48:24.144Z","2.46.174":"2022-03-31T04:51:51.592Z","2.46.175":"2022-03-31T04:54:58.691Z","2.46.176":"2022-03-31T04:57:58.741Z","2.46.177":"2022-03-31T05:00:50.779Z","2.46.178":"2022-03-31T05:04:00.378Z","2.46.179":"2022-03-31T05:07:38.278Z","2.46.180":"2022-03-31T05:11:35.770Z","2.46.181":"2022-03-31T05:14:33.922Z","2.46.182":"2022-03-31T05:17:42.529Z","2.46.183":"2022-03-31T05:20:08.900Z","2.46.184":"2022-03-31T05:22:44.227Z","2.46.185":"2022-03-31T05:25:21.199Z","2.46.186":"2022-03-31T05:28:04.189Z","2.46.187":"2022-03-31T05:31:48.386Z","2.46.188":"2022-03-31T05:34:17.658Z","2.46.189":"2022-03-31T05:37:14.057Z","2.46.190":"2022-03-31T05:40:04.624Z","2.46.191":"2022-03-31T05:42:39.503Z","2.46.192":"2022-03-31T05:45:22.610Z","2.46.193":"2022-03-31T05:49:22.929Z","2.46.194":"2022-03-31T05:53:04.399Z","2.46.195":"2022-03-31T05:55:54.018Z","2.46.196":"2022-03-31T05:59:00.830Z","2.46.197":"2022-03-31T06:02:01.256Z","2.46.198":"2022-03-31T06:06:10.936Z","3.1.3-canary.0":"2022-04-01T20:18:08.980Z","3.1.3-canary.1":"2022-04-04T19:24:53.332Z","3.2.0":"2022-04-04T20:41:45.268Z","2.47.0":"2022-04-04T20:42:05.046Z","2.47.1":"2022-04-05T20:25:14.900Z","3.2.1":"2022-04-06T22:14:08.592Z","2.47.2":"2022-04-11T15:40:15.194Z","3.3.0":"2022-04-11T18:19:16.670Z","3.3.1-canary.2":"2022-04-18T18:29:03.973Z","3.3.1-canary.4":"2022-04-21T21:20:47.700Z","3.4.0":"2022-04-26T13:13:13.457Z","3.4.1":"2022-04-26T15:53:07.287Z","3.4.2":"2022-04-26T18:42:28.885Z","3.5.0":"2022-04-28T13:51:16.806Z","3.5.1-canary.10":"2022-05-05T22:43:20.727Z","3.6.0":"2022-05-05T23:12:55.389Z","2.47.3":"2022-05-11T18:28:47.948Z","3.6.1-canary.7":"2022-05-17T13:18:56.339Z","3.6.1-canary.11":"2022-05-17T20:03:33.642Z","3.7.0":"2022-05-24T14:26:25.120Z","3.8.0":"2022-06-02T14:42:46.021Z","3.8.1-canary.3":"2022-06-08T12:33:47.671Z","3.9.0":"2022-06-08T19:37:22.297Z","2.47.4":"2022-06-09T01:22:25.483Z","2.47.5":"2022-06-10T17:26:42.126Z","3.9.1-canary.7":"2022-06-14T19:02:49.300Z","3.9.1-canary.21":"2022-06-20T20:06:08.604Z","3.9.1-canary.24":"2022-06-28T14:37:23.945Z","4.1.0":"2022-06-28T23:33:10.934Z","2.47.6":"2022-07-07T13:54:00.543Z","3.10.0":"2022-07-14T23:33:38.893Z","3.10.1":"2022-07-26T14:35:10.337Z","2.47.7":"2022-07-26T14:35:43.135Z","3.10.2":"2022-07-27T15:00:36.393Z","3.10.3":"2022-08-04T16:11:31.731Z","2.47.9":"2022-09-22T13:55:33.525Z"},"bugs":{"url":"https://github.com/apollosproject/apollos-apps/issues"},"license":"SEE LICENSE IN LICENSE.md","homepage":"https://github.com/apollosproject/apollos-apps#readme","keywords":["react-native-component","react-component","react-native"],"repository":{"url":"git://github.com/apollosproject/apollos-apps.git","type":"git"},"description":"React Native components to create an Onboarding experience.","maintainers":[{"email":"vince@classyh.at","name":"yungvincenzo"},{"email":"hi@convan.me","name":"conrad_vanl"},{"email":"micneeley14@gmail.com","name":"redreceipt"},{"email":"npm@differential.com","name":"didevshop"},{"email":"nick@differential.com","name":"nick-di"},{"email":"apps@apollos.app","name":"apollosadmin"},{"email":"nathan@differential.com","name":"nathanlewis.differential"}],"readme":"","readmeFilename":""}