{"_id":"-adisagar2003-react-share-on-social","name":"-adisagar2003-react-share-on-social","dist-tags":{"latest":"1.0.9"},"versions":{"1.0.9":{"name":"-adisagar2003-react-share-on-social","description":"Native sharing using the Web Share API if supported, a beautiful fallback if not.","author":{"name":"Karl Sellergren"},"version":"1.0.9","license":"MIT","repository":{"type":"git","url":"git+https://github.com/sakerhetspolisen/react-share-on-social.git"},"module":"dist/react-share-on-social.esm.js","main":"dist/index.js","typings":"dist/index.d.ts","sideEffects":false,"scripts":{"start":"tsdx watch","build":"tsdx build && filesize","lint":"tsdx lint ./src","prepare":"tsdx build && filesize","storybook":"start-storybook -p 6006","build-storybook":"build-storybook","prepublishOnly":"tsdx build"},"dependencies":{"copy-to-clipboard":"^3.3.1"},"peerDependencies":{"react":">=17"},"devDependencies":{"@ampproject/filesize":"^4.3.0","@babel/core":"^7.13.16","@size-limit/preset-small-lib":"^4.10.2","@storybook/addon-essentials":"^6.1.14","@storybook/addon-info":"^5.3.21","@storybook/addon-knobs":"^6.1.14","@storybook/addon-links":"^6.1.14","@storybook/addon-storysource":"^6.1.14","@storybook/addons":"^6.1.14","@storybook/react":"^6.1.14","@types/react":"^17.0.0","@types/react-dom":"^17.0.0","babel-loader":"^8.2.2","eslint-plugin-prettier":"^3.4.0","husky":"^6.0.0","react":"^16.13.1","react-dom":"^17.0.2","react-is":"^17.0.2","size-limit":"^4.10.2","ts-loader":"^9.1.0","tsdx":"^0.14.1","tslib":"^2.2.0","typescript":"^4.2.4"},"prettier":{"printWidth":100,"semi":true,"singleQuote":false,"trailingComma":"es5","endOfLine":"auto"},"filesize":{"track":["./dist/*.production.min.js"]},"size-limit":[{"path":"dist/react-multi-select-component.cjs.production.min.js","limit":"10 KB"},{"path":"dist/react-multi-select-component.esm.js","limit":"10 KB"}],"keywords":["react","share","social-share","web-share","native","fallback","polyfill","component","tiny","lightweight","copy-to-clipboard"],"gitHead":"e46ae263c19fc39a34cceb3d20998aa6727a80fc","bugs":{"url":"https://github.com/sakerhetspolisen/react-share-on-social/issues"},"homepage":"https://github.com/sakerhetspolisen/react-share-on-social#readme","_id":"-adisagar2003-react-share-on-social@1.0.9","_nodeVersion":"16.18.0","_npmVersion":"8.19.2","dist":{"integrity":"sha512-oGmL7aziaB5mPJOBUhDEKOXke0QN4p9zIRvoQdVWu/ooO6AmUZ9gUkvLSWk5xnUCoaMptiZoO+YZXANFxXZlfw==","shasum":"c60d60140ae4bf52371a698315e98258d5108cef","tarball":"https://registry.npmjs.org/-adisagar2003-react-share-on-social/-/-adisagar2003-react-share-on-social-1.0.9.tgz","fileCount":35,"unpackedSize":340149,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCLEQVgSZAYa29S+HUegk2pW/N7WLth5CII804VqhaXXwIgKzZWKPr+R0uDIwaXRgZAb81YXXP5x8yuDVozgV1lv1Y="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjYcOdACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqUEg//f1I4QLLe7X5KU/LdB0MCPTZnmAeD3wxftWU3j5ouXQxbL+jM\r\nPzVWKslVGQZjTIs0AOT7ZJF6XMnxv/YDVMlBFMBAy7cqKu+pZHo1QMXzQrw3\r\nQG/JT+/yY0QsLa3N2zNEAGi9yd4k9JOavPJHNAV+wETzYQXQ1JBvv/79kuRi\r\nuvAYegPO7qiZo4rvT3ohLMw+M/BW7arXGAFAv4Ak+2XZ+clJFBqDtnTg/bHq\r\nQ9OKY6UJhU7P47nBl/zwHB/RfZnVsSA/f/+w929H7KvWbwjVenYHwNzys4aH\r\n+/Y6FYZzrLoWFZZSh+ECr1iY4AaccGdhkDZ+KsJUudNWWSIurxKfLdFL0Us7\r\nQyNAciis7A2qdoDjR6iBWgaTWbsaTyXkv4S1CoZ+AcPkOaZ4oHv27QwZISc7\r\nTAmeIB7XkiUDzgs6UDH83nTYekTsJgZvQ4/2TAIY01Fuq4rIQPqOs242CW+G\r\nZoNdYjlPVPLIgcv6fO0XT0PtbF+Fcqn4c6PhPvQ5d3mV2K6bqLpQSK1OlkHR\r\nvXXWKVIy2UmanxeA2t3H7z+ezuVUTJbnratwARx1nKqhg806cn3jgP3dwVjM\r\nX3PNhzS9Q9b10ZOjtbwut2ytVNuH55MMZG3SeTSG+z7PUUmyutijqsBYp5j3\r\n845yt7hKOGyHK8EL+QgPrdzwyDWpZOzNGCk=\r\n=Jfh0\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"adisagar2003","email":"adityasagarpython@gmail.com"},"directories":{},"maintainers":[{"name":"adisagar2003","email":"adityasagarpython@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/-adisagar2003-react-share-on-social_1.0.9_1667351453730_0.4572354815513606"},"_hasShrinkwrap":false}},"time":{"created":"2022-11-02T01:10:53.730Z","1.0.9":"2022-11-02T01:10:53.904Z","modified":"2022-11-02T01:10:54.029Z"},"maintainers":[{"name":"adisagar2003","email":"adityasagarpython@gmail.com"}],"description":"Native sharing using the Web Share API if supported, a beautiful fallback if not.","homepage":"https://github.com/sakerhetspolisen/react-share-on-social#readme","keywords":["react","share","social-share","web-share","native","fallback","polyfill","component","tiny","lightweight","copy-to-clipboard"],"repository":{"type":"git","url":"git+https://github.com/sakerhetspolisen/react-share-on-social.git"},"author":{"name":"Karl Sellergren"},"bugs":{"url":"https://github.com/sakerhetspolisen/react-share-on-social/issues"},"license":"MIT","readme":"

react-share-on-social

\n

:smiling_face_with_three_hearts::stuck_out_tongue_winking_eye::money_mouth_face::sunglasses::partying_face:

\n

Native sharing if supported, beautiful fallback if not.

\n

A ~8kb package for effortless social media sharing, originally forked from react-web-share.

\n
\n \"npm\n \"Maintenance\"\n \"npm\"\n \"NPM\"\n
\n
\n

\n \n Demo\n \n

\n
\n
\n Enhanced with ❤︎ by \n Karl Sellergren, originally built by \n \n Harsh Zalavadiya.\n
\n

\n

\n
\n \"react-share-on-social\n
\n\n## Features\n\n- Uses the [Web Share API](https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share) for [supported browsers](https://caniuse.com/web-share)\n- Copy to clipboard functionality using [copy-to-clipboard](https://www.npmjs.com/package/copy-to-clipboard)\n- Uses [React Portal](https://reactjs.org/docs/portals.html) to render the component outside the parent DOM hierarchy\n\n## Installation\n\n```bash\nnpm install react-share-on-social\n```\n\nor, if you're using yarn:\n\n```bash\nyarn add react-share-on-social\n```\n\n## Usage\n\nPassing the `linkFavicon` prop drastically improves UX for devices that use the fallback. Without `linkFavicon`, the fallback renders a grey box instead.\n\n> Note: The Web Share API only works in secure contexts (HTTPS). Read more [here](https://www.w3.org/TR/web-share/#security-and-privacy-considerations).\n\n```js\nimport React from \"react\";\nimport ShareOnSocial from \"react-share-on-social\";\nimport favicon from \"../assets/favicon.png\";\n\nconst Example = () => {\n return (\n \n \n \n );\n};\n```\n\n## Required props\n\n| Property | Type | Description |\n| -------------- | ------------------ | --------------------------------------------------------------------------------------- |\n| `textToShare` | `string` | The text that appears in the post. |\n| `link` | `URL` | The URL to share. |\n| `linkTitle` | `string` | The link title which should correspond to the `` tag. |\n| `linkMetaDesc` | `string` | The meta description of the link, should correspond to the `<meta og:description>` tag. |\n| `linkFavicon` | `HTMLImageElement` | A small image which is shown in the header of th popup fallback. |\n\n## Optional props\n\n| Property | Type | Default | Description |\n| --------------------- | --------------- | ---------------------------------------- | --------------------------------------------------------------------------------------- |\n| `shareTo` | `Array<string>` | `[\"facebook\", \"twitter\", ... , \"email\"]` | A list of all social media channels that should appear in the fallback. |\n| `noReferer` | `boolean` | `false` | If the social media buttons should have a `noreferrer` tag or not. |\n| `backdropColor` | `string` | `rgba(0,0,0,0.4)` | The background color of the backdrop. |\n| `closeText` | `string` | `Close` | The label of the close button. |\n| `copyToClipboardText` | `string` | `Copy to clipboard` | The label of the copy to clipboard button. |\n| `copySuccessText` | `string` | `Copied` | The label of the copy to clipboard button after a successful copy. |\n| `onSocialClick` | `() => void` | `() => null` | A callback invoked when user clicks on any of the social media buttons in the fallback. |\n\n## Supported socials\n\nThe supported props are passed in the sharing URL to each service, and will appear in the post draft.\n| Social media | Supported props | \n| ----------- | ----------- |\n| Facebook | `link` |\n| Twitter | `link`, `textToShare` |\n| Whatsapp | `link` |\n| Reddit | `link`, `textToShare` |\n| LinkedIn | `link`, `linkTitle`, `textToShare` |\n| Pinterest | `link` |\n| Telegram | `link`, `textToShare` |\n| Email | `link`, `textToShare` |\n\n## What is the difference between `react-share-on-social` and `react-web-share`?\n\n- The fallback is more rich with a header and an improved copy-to-clipboard functionality\n\n- Props are restructured for better usability\n\n- Pinterest is supported\n\n- Social media services are opened in a minimal window instead of a new tab\n\n## Contribute\n\nSo you want to contribute? Good, the world needs more brave troopers like you. Contributions are what makes the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated by us and the community.\n\n- If you find a typo, bug or want to add a feature, create an issue or add a pull request with the code you want to add!\n\n- Regarding bugs, please make sure that your issue is:\n\n - _Reproducible_. Include steps to reproduce the problem.\n\n - _Specific_. Include as much detail as possible: which device you use, how you have interacted with the website, etc.\n\n - _Scoped to a Single Bug_. One bug per issue.\n\n## License\n\n[MIT](https://tldrlegal.com/license/mit-license)\n","readmeFilename":"README.md"}