{"_id":"@bdebeltran25/react-floating-whatsapp","_rev":"1-6850ec02e270701a14b087091d2e17b5","name":"@bdebeltran25/react-floating-whatsapp","dist-tags":{"latest":"5.0.9"},"versions":{"5.0.8":{"name":"@bdebeltran25/react-floating-whatsapp","version":"5.0.8","private":false,"description":"Simple React Component for adding a floating WhatsApp button to your project.","author":{"name":"awran5","email":"awran5@yahoo.com"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/bdebeltran/react-floating-whatsapp.git"},"bugs":{"url":"https://github.com/awran5/react-floating-whatsapp/issues"},"homepage":"https://react-floating-whatsapp.vercel.app/","main":"dist/index.js","source":"src/index.tsx","engines":{"node":">=16"},"scripts":{"clean":"rm -rf dist","clean-sb":"rm -rf storybook-static","build":"yarn clean && rollup -c --exports auto","start":"start-storybook -p 6006","log":"auto-changelog -p --template keepachangelog && git add CHANGELOG.md","build-sb":"build-storybook && vercel --prod"},"peerDependencies":{"react":">=18.0.0","react-dom":">=18.0.0"},"devDependencies":{"@babel/core":"^7.19.3","@rollup/plugin-commonjs":"^22.0.2","@rollup/plugin-node-resolve":"^14.1.0","@rollup/plugin-terser":"^0.1.0","@rollup/plugin-url":"^7.0.0","@storybook/addon-actions":"^6.5.13","@storybook/addon-essentials":"^6.5.13","@storybook/addon-interactions":"^6.5.13","@storybook/addon-links":"^6.5.13","@storybook/builder-webpack5":"^6.5.13","@storybook/manager-webpack5":"^6.5.13","@storybook/preset-create-react-app":"^4.1.2","@storybook/react":"^6.5.13","@storybook/testing-library":"^0.0.13","@types/react":"^18.0.21","@types/react-dom":"^18.0.6","auto-changelog":"^2.4.0","autoprefixer":"^10.4.12","babel-loader":"^8.2.5","postcss":"^8.4.17","prettier":"^2.7.1","react":"^18.2.0","react-dom":"^18.2.0","react-icons":"^4.4.0","react-scripts":"^5.0.1","rollup":"^2.79.1","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-postcss":"^4.0.2","rollup-plugin-typescript2":"^0.34.1","typescript":"^4.8.4"},"publishConfig":{"access":"public"},"keywords":["react","whatsapp","floating whatsapp button","whatsapp button","react component","react typescript"],"tags":["react","whatsapp","floating-whatsapp-button","whatsapp-button","react-component","react-typescript"],"eslintConfig":{"extends":["react-app"]},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"dependencies":{},"gitHead":"11287b4048f7c3ae80db74df01043da798bcccf1","_id":"@bdebeltran25/react-floating-whatsapp@5.0.8","_nodeVersion":"18.14.2","_npmVersion":"9.5.1","dist":{"integrity":"sha512-gBXenFephemBy15O430cvOZdyOe6IG1Dc28X8Q5dYQJT1Q9SJn4oH1wecpPJiS3oZUMDFF7qDQwxmGpT8DOWkA==","shasum":"1c5650849ff707ea3978c00e3a108f7f45144eca","tarball":"https://registry.npmjs.org/@bdebeltran25/react-floating-whatsapp/-/react-floating-whatsapp-5.0.8.tgz","fileCount":3,"unpackedSize":12111,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHlgvwGXAzXrb3F0Kilxa8oUZmkYfSSlCCJJlgVGLnbCAiA+Mz1CFjBhp9mTTh17zFpQEjJsBxotSfyOwM/0piNsZw=="}]},"_npmUser":{"name":"bdebeltran25","email":"b.de.beltran@gmail.com"},"directories":{},"maintainers":[{"name":"bdebeltran25","email":"b.de.beltran@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-floating-whatsapp_5.0.8_1692648222820_0.6165080403017071"},"_hasShrinkwrap":false},"5.0.9":{"name":"@bdebeltran25/react-floating-whatsapp","version":"5.0.9","private":false,"description":"Simple React Component for adding a floating WhatsApp button to your project.","author":{"name":"awran5","email":"awran5@yahoo.com"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/bdebeltran/react-floating-whatsapp.git"},"bugs":{"url":"https://github.com/awran5/react-floating-whatsapp/issues"},"homepage":"https://react-floating-whatsapp.vercel.app/","main":"dist/index.js","source":"src/index.tsx","engines":{"node":">=16"},"scripts":{"clean":"rm -rf dist","clean-sb":"rm -rf storybook-static","build":"yarn clean && rollup -c --exports auto","start":"start-storybook -p 6006","log":"auto-changelog -p --template keepachangelog && git add CHANGELOG.md","build-sb":"build-storybook && vercel --prod"},"peerDependencies":{"react":">=18.0.0","react-dom":">=18.0.0"},"devDependencies":{"@babel/core":"^7.19.3","@rollup/plugin-commonjs":"^22.0.2","@rollup/plugin-node-resolve":"^14.1.0","@rollup/plugin-terser":"^0.1.0","@rollup/plugin-url":"^7.0.0","@storybook/addon-actions":"^6.5.13","@storybook/addon-essentials":"^6.5.13","@storybook/addon-interactions":"^6.5.13","@storybook/addon-links":"^6.5.13","@storybook/builder-webpack5":"^6.5.13","@storybook/manager-webpack5":"^6.5.13","@storybook/preset-create-react-app":"^4.1.2","@storybook/react":"^6.5.13","@storybook/testing-library":"^0.0.13","@types/react":"^18.0.21","@types/react-dom":"^18.0.6","auto-changelog":"^2.4.0","autoprefixer":"^10.4.12","babel-loader":"^8.2.5","postcss":"^8.4.17","prettier":"^2.7.1","react":"^18.2.0","react-dom":"^18.2.0","react-icons":"^4.4.0","react-scripts":"^5.0.1","rollup":"^2.79.1","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-postcss":"^4.0.2","rollup-plugin-typescript2":"^0.34.1","typescript":"^4.8.4"},"publishConfig":{"access":"public"},"keywords":["react","whatsapp","floating whatsapp button","whatsapp button","react component","react typescript"],"tags":["react","whatsapp","floating-whatsapp-button","whatsapp-button","react-component","react-typescript"],"eslintConfig":{"extends":["react-app"]},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"dependencies":{},"gitHead":"7e3812a917ad533ddb927cbb94a069efeff071ef","_id":"@bdebeltran25/react-floating-whatsapp@5.0.9","_nodeVersion":"18.14.2","_npmVersion":"9.5.1","dist":{"integrity":"sha512-xqiYWQAZMESA4X7IPmUsNB3ASKEwS/99M+eEy7X4r05t7Ahu3YUtNFPNVvz6yUP6ynavegjhlR2eCxmmyn1Ocw==","shasum":"1842f30f2494dd8f69222cc9659d5cd5e6e42141","tarball":"https://registry.npmjs.org/@bdebeltran25/react-floating-whatsapp/-/react-floating-whatsapp-5.0.9.tgz","fileCount":3,"unpackedSize":12111,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDQEl0xPg15dgAIi00NfqLMeHR8aM7/POUXzdqylfPvVAiBlOpWn0wqQkjk56SjeFIK3i+ePbA5+D5CAIWt0NVD8oQ=="}]},"_npmUser":{"name":"bdebeltran25","email":"b.de.beltran@gmail.com"},"directories":{},"maintainers":[{"name":"bdebeltran25","email":"b.de.beltran@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-floating-whatsapp_5.0.9_1692648827894_0.9241336903157957"},"_hasShrinkwrap":false}},"time":{"created":"2023-08-21T20:03:42.679Z","5.0.8":"2023-08-21T20:03:43.025Z","modified":"2023-08-21T20:13:48.310Z","5.0.9":"2023-08-21T20:13:48.105Z"},"maintainers":[{"name":"bdebeltran25","email":"b.de.beltran@gmail.com"}],"description":"Simple React Component for adding a floating WhatsApp button to your project.","homepage":"https://react-floating-whatsapp.vercel.app/","keywords":["react","whatsapp","floating whatsapp button","whatsapp button","react component","react typescript"],"repository":{"type":"git","url":"git+https://github.com/bdebeltran/react-floating-whatsapp.git"},"author":{"name":"awran5","email":"awran5@yahoo.com"},"bugs":{"url":"https://github.com/awran5/react-floating-whatsapp/issues"},"license":"MIT","readme":"# React Floating Whatsapp\n\n> Simple react component for adding a floating WhatsApp button to your project.\n\n[![NPM](https://img.shields.io/npm/v/react-floating-whatsapp.svg)](https://www.npmjs.com/package/react-floating-whatsapp)\n![npm bundle size](https://img.shields.io/bundlephobia/min/react-floating-whatsapp)\n![GitHub](https://img.shields.io/github/license/awran5/react-floating-whatsapp)\n\n

\n \"screenshot\"\n

\n\n## Install\n\n#### npm\n\n```bash\nnpm i react-floating-whatsapp\n```\n\n#### Yarn\n\n```bash\nyarn add react-floating-whatsapp\n```\n\n## [v5.0.0](https://github.com/awran5/react-floating-whatsapp/compare/v4.0.5...v5.0.0) - 2022-10-07\n\n- **BREAKING CHANGES:** change **default** import to **name** import\n- **BREAKING CHANGES:** rename `height` prop to `chatboxHeight`\n- **BREAKING CHANGES:** rename `styles` prop to `style`\n- **BREAKING CHANGES:** `notificationDelay` now in seconds instead of millisecond\n\n## Usage\n\n```jsx\nimport React from 'react'\nimport { FloatingWhatsApp } from 'react-floating-whatsapp'\n\nexport default function App() {\n\n return (\n \n )\n}\n```\n\n### Props\n\n| Prop | Type | Options | Description | Default |\n| ----------------------- | :-----------: | -------- | ------------------------------------------------------------------------------------------------------------------------- | :----------------------------------: |\n| `phoneNumber` | String | Required | Phone number in [intenational format](https://faq.whatsapp.com/general/contacts/how-to-add-an-international-phone-number) | `1234567890` |\n| `accountName` | String | Required | Account username | `Account Name` |\n| `onClick` | Function | Optional | Callback function fires on click | `-` |\n| `onSubmit` | Function | Optional | Callback function fires on submit with event and form input value passed | `-` |\n| `onClose` | Function | Optional | Callback function fires on close | `-` |\n| `onLoopDone` | Function | Optional | Callback function called when notification loop done | `-` |\n| `onNotification` | Function | Optional | Callback function fired when notification runs | `-` |\n| `avatar` | String | Optional | Change user avatar using [static assets](https://create-react-app.dev/docs/adding-images-fonts-and-files/) | `UI Face` |\n| `statusMessage` | String | Optional | Text below the account username | `Typically replies within 1 hour` |\n| `chatMessage` | String | Optional | Text inside the chat box. | `Hello there! 🤝 \\nHow can we help?` |\n| `placeholder` | String | Optional | Input placeholder. | `Type a message..` |\n| `messageDelay` | Number | Optional | Time delay after which the chatMessage is displayed (in seconds). | `2` |\n| `darkMode` | Boolean | Optional | Dark style. | `false` |\n| `allowClickAway` | Boolean | Optional | Closes the chat box when user clicks outside | `false` |\n| `allowEsc` | Boolean | Optional | Closes the chat box when `Escape` key is pressed | `false` |\n| `className` | String | Optional | CSS className applied to the main wrapping `Div` | `floating-whatsapp` |\n| `buttonClassName` | String | Optional | CSS className applied to button | `floating-whatsapp-button` |\n| `style` | CSSProperties | Optional | Inline style applied to the main wrapping `Div` | `{}` |\n| `buttonStyle` | CSSProperties | Optional | Inline style applied to button | `{}` |\n| `chatboxHeight` | Number | Optional | Control chat box height | `320` |\n| `chatboxClassName` | String | Optional | CSS className applied to chat box | `floating-whatsapp-chatbox` |\n| `chatboxStyle` | CSSProperties | Optional | Inline style applied to chat box | `{}` |\n| `notification` | Boolean | Optional | Allow notifications (Disabled after user open the chat box) | `false` |\n| `notificationDelay` | Number | Optional | Time delay between notifications in seconds | `60` |\n| `notificationSound` | Boolean | Optional | Allow notification sound | `false` |\n| `notificationSoundSrc` | String | Optional | Notification sound custom src | `-` |\n| `notificationLoop` | Number | Optional | Repeat notifications loop | `0` |\n| `notificationStyle` | CSSProperties | Optional | Inline style applied to notification | `-` |\n| `notificationClassName` | String | Optional | CSS className applied to notification indicator | `floating-whatsapp-notification` |\n\n
\n\n[![Edit react-floating-whatsapp](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/react-floating-whatsapp-183py)\n\n### License\n\nMIT © [awran5](https://github.com/awran5/)\n","readmeFilename":"README.md"}