Current collected state Current
Observed since 20 Oct, 16:13 UTC
No superseded metadata states collected. Unchanged observations do not create new revisions.
Back to packageRELEASE DETAILS
0.3.19
npm0.3.20-beta.11
Synapse Reusable components library v2
Published19 Apr 2021
Direct dependencies39
Transitive dependenciesNot calculated
README
Current package documentationsynapse-ui
Reusable ui components for Synapse
Adding a new component
- Create your new component inside the
src/folder. You could place your component into any of the existing folders or create a new one. - Create your style files inside its respective component folder.
- Create index.js file in the root of the new folder like so
src/_your_folder/index.js. - Import and export the new components inside index.js like so
import Component1 from './Component1/Component1; import Component2 from './Component2/Component2; import Component3 from './Component3/Component3; export { Component1, Component2, Component3, {... moreComponents} };
Testing your new components
- Go to the
package.jsonof synapse-ui and change thenameattribute forsynapse-ui-v2. - Run
yarn install. - Run
yarn build. - Run
yarn link. - Then go to the project directory where you will use synapse-ui and run
yarn link synapse-ui-v2.
Testing your components with Storybook
- Create a stories.jsx file along with your component
- Run
yarn install - Run
yarn storybook - Navigate to your component in Storybook dashboard
- For additional context, please refer to official Storybook documentation at https://www.learnstorybook.com/
Publishing
- Run
yarn install. - If you are not logged in. Run
npm login. Make sure to count with a npm account. - Run the
npm publishcommand. - !Done¡.
Downloads & popularity
Awaiting observationsNo metric observations yet
Download counts and popularity will appear here as the collector receives them.
Declared dependencies 44
Native requirements39 direct targetsNot calculated transitive count
| Package / target | Requirement | Relationship |
|---|---|---|
@date-io/coreEnvironment{
"local_name": "@date-io/core",
"alias": false,
"peer_metadata": null
} | ^1.3.11 | runtime |
@date-io/date-fnsEnvironment{
"local_name": "@date-io/date-fns",
"alias": false,
"peer_metadata": null
} | ^1.3.11 | runtime |
@material-ui/coreEnvironment{
"local_name": "@material-ui/core",
"alias": false,
"peer_metadata": null
} | 4.3.1 | runtime |
@material-ui/pickersEnvironment{
"local_name": "@material-ui/pickers",
"alias": false,
"peer_metadata": null
} | ^3.2.7 | runtime |
classnamesEnvironment{
"local_name": "classnames",
"alias": false,
"peer_metadata": null
} | ^2.2.6 | runtime |
date-fnsEnvironment{
"local_name": "date-fns",
"alias": false,
"peer_metadata": null
} | ^2.4.1 | runtime |
filestack-jsEnvironment{
"local_name": "filestack-js",
"alias": false,
"peer_metadata": null
} | 3.12.4 | runtime |
lodashEnvironment{
"local_name": "lodash",
"alias": false,
"peer_metadata": null
} | ^4.17.15 | runtime |
momentEnvironment{
"local_name": "moment",
"alias": false,
"peer_metadata": null
} | ^2.24.0 | runtime |
reactEnvironment{
"local_name": "react",
"alias": false,
"peer_metadata": null
} | ^16.10.2 | runtime |
react-app-polyfillEnvironment{
"local_name": "react-app-polyfill",
"alias": false,
"peer_metadata": null
} | ^1.0.6 | runtime |
react-domEnvironment{
"local_name": "react-dom",
"alias": false,
"peer_metadata": null
} | ^16.10.2 | runtime |
react-draggable-listEnvironment{
"local_name": "react-draggable-list",
"alias": false,
"peer_metadata": null
} | ^4.0.3 | runtime |
react-mentionsEnvironment{
"local_name": "react-mentions",
"alias": false,
"peer_metadata": null
} | ^3.3.1 | runtime |
uuidEnvironment{
"local_name": "uuid",
"alias": false,
"peer_metadata": null
} | ^3.4.0 | runtime |
@babel/coreEnvironment{
"local_name": "@babel/core",
"alias": false,
"peer_metadata": null
} | ^7.8.4 | development |
@babel/preset-envEnvironment{
"local_name": "@babel/preset-env",
"alias": false,
"peer_metadata": null
} | ^7.8.4 | development |
@babel/preset-reactEnvironment{
"local_name": "@babel/preset-react",
"alias": false,
"peer_metadata": null
} | ^7.8.3 | development |
@rollup/plugin-aliasEnvironment{
"local_name": "@rollup/plugin-alias",
"alias": false,
"peer_metadata": null
} | ^3.1.2 | development |
@rollup/plugin-commonjsEnvironment{
"local_name": "@rollup/plugin-commonjs",
"alias": false,
"peer_metadata": null
} | ^18.0.0 | development |
@storybook/addon-actionsEnvironment{
"local_name": "@storybook/addon-actions",
"alias": false,
"peer_metadata": null
} | ^6.1.10 | development |
@storybook/addon-essentialsEnvironment{
"local_name": "@storybook/addon-essentials",
"alias": false,
"peer_metadata": null
} | ^6.1.10 | development |
@storybook/addon-linksEnvironment{
"local_name": "@storybook/addon-links",
"alias": false,
"peer_metadata": null
} | ^6.1.10 | development |
@storybook/preset-scssEnvironment{
"local_name": "@storybook/preset-scss",
"alias": false,
"peer_metadata": null
} | ^1.0.3 | development |
@storybook/reactEnvironment{
"local_name": "@storybook/react",
"alias": false,
"peer_metadata": null
} | ^6.1.10 | development |
babel-loaderEnvironment{
"local_name": "babel-loader",
"alias": false,
"peer_metadata": null
} | ^8.2.2 | development |
css-loaderEnvironment{
"local_name": "css-loader",
"alias": false,
"peer_metadata": null
} | ^5.0.1 | development |
node-sassEnvironment{
"local_name": "node-sass",
"alias": false,
"peer_metadata": null
} | ^4.13.1 | development |
prop-typesEnvironment{
"local_name": "prop-types",
"alias": false,
"peer_metadata": null
} | ^15.7.2 | development |
rollupEnvironment{
"local_name": "rollup",
"alias": false,
"peer_metadata": null
} | ^2.45.2 | development |
rollup-plugin-aliasEnvironment{
"local_name": "rollup-plugin-alias",
"alias": false,
"peer_metadata": null
} | ^2.2.0 | development |
rollup-plugin-babelEnvironment{
"local_name": "rollup-plugin-babel",
"alias": false,
"peer_metadata": null
} | ^4.3.3 | development |
rollup-plugin-commonjsEnvironment{
"local_name": "rollup-plugin-commonjs",
"alias": false,
"peer_metadata": null
} | ^10.1.0 | development |
rollup-plugin-node-resolveEnvironment{
"local_name": "rollup-plugin-node-resolve",
"alias": false,
"peer_metadata": null
} | ^5.2.0 | development |
rollup-plugin-postcssEnvironment{
"local_name": "rollup-plugin-postcss",
"alias": false,
"peer_metadata": null
} | ^2.0.6 | development |
rollup-plugin-replaceEnvironment{
"local_name": "rollup-plugin-replace",
"alias": false,
"peer_metadata": null
} | ^2.2.0 | development |
sassEnvironment{
"local_name": "sass",
"alias": false,
"peer_metadata": null
} | ^1.25.0 | development |
sass-loaderEnvironment{
"local_name": "sass-loader",
"alias": false,
"peer_metadata": null
} | ^10.1.0 | development |
style-loaderEnvironment{
"local_name": "style-loader",
"alias": false,
"peer_metadata": null
} | ^2.0.0 | development |
@material-ui/coreEnvironment{
"local_name": "@material-ui/core",
"alias": false,
"peer_metadata": null
} | 4.3.1 | peer |
node-sassEnvironment{
"local_name": "node-sass",
"alias": false,
"peer_metadata": null
} | ^4.13.1 | peer |
prop-typesEnvironment{
"local_name": "prop-types",
"alias": false,
"peer_metadata": null
} | ^15.7.2 | peer |
reactEnvironment{
"local_name": "react",
"alias": false,
"peer_metadata": null
} | ^16.10.2 | peer |
react-domEnvironment{
"local_name": "react-dom",
"alias": false,
"peer_metadata": null
} | ^16.10.2 | peer |
Distribution files
1 collectedDistribution 1
Source fileSource distribution
Checksums from source
{
"integrity": "sha512-WtxCOBr9DYEF+mtT+5Uw6c1ZDFEDlJN7fGjAGTIWokUawqir4kTT2CwHC9lS449f1GChRDTCKDXoTQkD8cO6jQ==",
"shasum": "c91e3df0ea0bdfecaca5ca4c26f3cd9accd234fe",
"tarball": "https://registry.npmjs.org/0.3.20-beta.11/-/0.3.20-beta.11-0.3.19.tgz",
"fileCount": 4,
"unpackedSize": 6604945,
"npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgfb2BCRA9TVsSAnZWagAAPasP/Rogfwz1hIU9ORKPVzmX\naxPCaBJPCYa5qraxW/gGKzziW9c5JJXNnBAglJ0ZIIsihGOuXjpjIkmpg/tG\nLxYIhYlQzWLZ1FqCCyDeRSNq/MR30i7cwIQO4kQ/hsQWxSgvYtm2KxLDfYEV\nsad6YsPY/ubnuNlCui1rtr5HDr4mAI59LEFf/Uyfn2NmUo4rtycayTWnusDt\nM9ol+4tcmMB9Tqyr0mr2Qmekl9WrE3NjjTvowugTZ5jE4P6exVwCiZ7m+/2A\nt3BCZ/D+isXcx6KRw0VMtXlzJTTGlIn4oCvHbdMokAOvaTQvwTF5Q9lXnPcY\naRf6YA1ODWP4k57b/LVhEP6LRDqoEJFW1ZH5FwkxACJxRv8RRFQIT6oHLrEn\n7E0FjvMFwqgjOz0Kgr1W/Abgonc9yCKlVFoLF/nMGVRNr7AR2P3pDAMtJbLR\nib53sunnWAPalDVpeVH6zwS/qM+FOgMav4JeaRYxp0jALihpbSWQ1xqUNhVE\ns5zb7QWbZL2DVOq5TgAusYxYZpKu+XfYQHORIqUzO4Bh1YxwdU1dVZALbzXz\nBWRy+7SIqkCT6Ro2iZBHI8G663kqWGYTNgwfNxMI79MmDvgAQZVnlkIjJ2m1\nhk39fRMQImUpkWmC1dkrGrpqCdZG7p3ddvODc/lMiq43QDE8POsu74uPGn8b\nCKdp\r\n=AfYL\r\n-----END PGP SIGNATURE-----\r\n",
"signatures": [
{
"keyid": "SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA",
"sig": "MEQCID6WI970db3KxJukaHGgMRaPCHOc7SHENg3fxjR5Wic2AiAByBOIM17L0IUTGtqojN+/w4WDhxOO4hEKLIjFwmNCrQ=="
}
]
}Metadata history
Meaningful changesRecord identity
package_version:bacc3ba3bf06015ead2c3fb0c36efab0852bcd4c7d4f8fd161b255e701d9752a