react-share-button
A lightweight React Share Button for mobile web with web share api integration, native intent support and fallback.
Features
- Web Share Api (on Origin Trials experiment until April 2017)
- Share Modal Fallback for other browsers
- Share via Whatsapp, FB, Twitter, Mail or Copy on Clipboard
Installation
npm install --save react-share-button Basic Usage
To get web-share API on your origin just request a token for your origin. You will get an email within 24 hrs with you key, then just add a meta tag
<meta http-equiv="origin-trial" content="**insert your token as provided in the the email here**"> Know more about OriginTrials
JSX:
import ShareBtn from 'react-share-button'; <ShareBtn url={url} text={text} className='ib' displayText='Share' />CSS
@import "react-share-button/dist/ShareBtn"Options
<ShareBtn/> Component
| prop | default | description |
|---|---|---|
| className | '' | Custom classnamem, you can style your button with this |
| url | '' | The URL you want to share |
| text | '' | The Text before the URL (E.g. Hey checkout this awesome property!!) |
| displayText | Share | Any text you wanna write on button like Share Property |
| onShareBtnClick | () => {} | A callback function when share button is clicked |
| sharedBy | (medium) => {console.log('shared via ', medium)} | A callback function when user clicks on any share medium from share modal |
Development
git clone https://github.com/housinghq/react-share-button cd react-share-button npm install npm run storybook Open an issue before opening a PR. The UI in this package is for mobile only.
License
MIT @ Loconsolutions
